Utilizare butoane Radio in script Ajax cu jQuery

Discutii si intrebari legate de scripturi si functii JavaScript, jQuery si Ajax, cod JavaScript in general.
Avatar utilizator
trif
Mesaje: 500

Utilizare butoane Radio in script Ajax cu jQuery

Salut, am si eu o mica problema si nu stiu cum sa o rezolv.
Am scripturile acestea:
javascript

Cod: Selectaţi tot

<script type="text/javascript">
   function lookup(inputString) {
      if(inputString.length == 0) {
         // Hide the suggestion box.
         $('#suggestions').hide();
      } else {
         $.post("cautare.php", {queryString: ""+inputString+""}, function(data){
            if(data.length >0) {
               $('#suggestions').show();
               $('#autoSuggestionsList').html(data);
            }
         });
      }
   } // lookup
</script>
ajax;

Cod: Selectaţi tot

<?php
    $db = new mysqli('localhost', 'root' ,'', 'bd');
     if(!$db) {
      echo 'Nu se poate conecta la Baza de date!';
   } else {
      if(isset($_POST['queryString'])) {
         $queryString = $db->real_escape_string($_POST['queryString']);         
         if(strlen($queryString) >0) {
         $categoria = 'c';
         //echo $categoria;
            $query = $db->query("SELECT * FROM cantari_ppt WHERE categoria='".$categoria."' AND aprobare = 1 AND denumire LIKE '$queryString%' ORDER BY denumire LIMIT 10");
            if($query) {
               while ($result = $query ->fetch_object()) {
                     //echo ''.$result->denumire.'<br>';
                   if ($result->categoria == 'c')
  {
                  echo '<span class="d"><img src="powerpoint_icon.png" width="24" height="24"> <a href="localhost/cautare/index.php?urlf='.$result->urlf.'">'.$result->denumire.'</a> </span> ~ copii<br>';
                  }
                   elseif ($result->categoria == 'co')
  {
                  echo '<span class="d"><img src="powerpoint_icon.png" width="24" height="24"> <a href="localhost/cautare/index.php?urlf='.$result->urlf.'">'.$result->denumire.'</a> </span> ~ colinde<br>';
                  }
              } 
            } else {
               echo 'A aparut o problema. nu este query';
            }
         } else {
         }
      }
       else {
         echo 'Nu s-a trimis nimic de la index!';
      }
         
   }
?>
scriptul ajax este intr-un fisier cautare.php de care se foloseste scriptul javascript sa apeleze in index.php

Cod: Selectaţi tot

<form id="search" name="search">
<input type="text" size="50" name="term" value="" placeholder="Scrie numele cantarii" id="inputString" onkeyup="lookup(this.value);" onblur="fill();" />
</form> <br><br>
	<div class="suggestionsBox" id="suggestions" style="display: none;"> 
				<div class="suggestionList" id="autoSuggestionsList">
				</div>
</div>
iar butoanele radio sunt;

Cod: Selectaţi tot

<form method="post" action="" id="frms">
<input type="radio" name="rbtn" value="" onclick="this.form.submit()">Toate
<input type="radio" name="rbtn" value="c" onclick="this.form.submit()">Copii
<input type="radio" name="rbtn" value="co" onclick="this.form.submit()">Colinde
</form>
Ceea ce vreau si nu stiu sa fac este:
ca atunci cand dau pe un buton radio sa imi ramana bifat si sa imi caute doar in sectiunea respectiva.
iar daca dau pe butonul "toate" sa nu tina cont de nimic ci sa caute in toate categoriile.
codul merge dar numai daca pun eu in cautare.php

Cod: Selectaţi tot

$categoria = 'c';
 
Sau cateogira dorita, nu vreau asta ci sa imi preia din index.
Sper ca ati inteles. astept raspuns. multumesc anticipat.
Cu stima trif.
M-am hotarat!
De ce sa fiu trist?
Oricum nu intereseaza pe nimeni...!
Mai bine sunt fericit si ii enervez pe toti cu fericirea mea!
http://www.cantaricrestine.ro
---> cu stima Trif
MarPlo Mesaje: 4343
Salut
Cu jQuery se poate prelua valuarea butonului radio bifat folosind acest cod:

Cod: Selectaţi tot

$("input:radio[name=nume_buton]").click(function() {
    var valoare = $(this).val();
});
Apoi adaugi acea valoare in datele trimise cu Ajax, si le preiei in scriptul php.
Poti incerca scriptul Ajax asa (vezi in cod ce e adaugat nou):

Cod: Selectaţi tot

<script type="text/javascript"><!--
var rbtn_v = '';     // aici se adauga valoarea initiala, transmisa daca nu e buton bifat

$(document).ready(function() {
  $("input:radio[name=rbtn]").click(function() {
    rbtn_v = $(this).val();
  });
});

function lookup(inputString) {
  if(inputString.length == 0) {
   // Hide the suggestion box.
   $('#suggestions').hide();
  } else {
   $.post("cautare.php", {queryString: inputString, rbtn: rbtn_v}, function(data){
    if(data.length >0) {
     $('#suggestions').show();
     $('#autoSuggestionsList').html(data);
    }
   });
  }
}
//-->
</script>
Iar in sxcript-ul PHP:

Cod: Selectaţi tot

$categoria = isset($_POST['rbtn']) ? $_POST['rbtn'] : 'c';
 
trif Mesaje: 500
Salut,
Nu imi merge.
Am pus in index.php asta:

Cod: Selectaţi tot

<script type="text/javascript"><!--
var rbtn_v = '';     // aici se adauga valoarea initiala, transmisa daca nu e buton bifat
$(document).ready(function() {
  $("input:radio[name=rbtn]").click(function() {
    rbtn_v = $(this).val();
  });
});

function lookup(inputString) {
  if(inputString.length == 0) {
   // Hide the suggestion box.
   $('#suggestions').hide();
  } else {
   $.post("cautare.php", {queryString: inputString, rbtn: rbtn_v}, function(data){
    if(data.length >0) {
     $('#suggestions').show();
     $('#autoSuggestionsList').html(data);
    }
   });
  }
}
//-->
</script>
si in cautare.php

Cod: Selectaţi tot

$categoria = isset($_POST['rbtn']) ? $_POST['rbtn'] : 'c';
iar codul este cel de mai sus.
Nu face nimic, nici nu merge scriptul de cautare nici nimic. preia oare

Cod: Selectaţi tot

<input type="radio" name="rbtn" value="" onClick="this.form.submit()">Toate
fisierul cautare.php?
Nu stiu ce sa ii fac.
Multumesc anticipat.
Cu stima Trif
M-am hotarat!
De ce sa fiu trist?
Oricum nu intereseaza pe nimeni...!
Mai bine sunt fericit si ii enervez pe toti cu fericirea mea!
http://www.cantaricrestine.ro
---> cu stima Trif
MarPlo Mesaje: 4343
Nu stiu daca acel fisier primeste datele care vrei din formular. Asta se poate verifica in scriptul PHP, cu: var_dump($_POST);
Incearca codul javascript pt Ajax asa:

Cod: Selectaţi tot

<script type="text/javascript"><!--
var rbtn_v = '';     // aici se adauga valoarea initiala, transmisa daca nu e buton bifat
$(document).ready(function() {
  $("input:radio[name=rbtn]").click(function() {
    rbtn_v = $(this).val();
  });
});

function lookup(inputString) {
  if(inputString.length == 0) {
   // Hide the suggestion box.
   $('#suggestions').hide();
  }
  else {
    var data = 'queryString='+$('#inputString').val()+ '&rbtn='+rbtn_v;
//     alert(data);    // verifica ce date preia si trimite javascript
    $.post('cautare.php', data, function(response){
//     alert(response);    // ca sa se verifice datele primite
      if(data.length > 0) {
        $('#suggestions').show();
        $('#autoSuggestionsList').html(response);
      }
    });

    return false;      // required to not open the page when form is submited
  }
}
//-->
</script>
- Mai departe, daca nu merge trebuie facute verificari:
- in PHP cu var_dump($_POST);
- in JavaScript cu: alert(data); pt. ce date preia si trimite javascript, iar cu: alert(response); pt ce date primeste de la server.
trif Mesaje: 500
salut,
am sters

Cod: Selectaţi tot

onclick="this.form.submit()"
si merge.
Dar mai am o mica problema. cum fac ca sa imi caute daca nu este apasat nici un buton radio?
Multumesc anticipat
Cu stima trif
M-am hotarat!
De ce sa fiu trist?
Oricum nu intereseaza pe nimeni...!
Mai bine sunt fericit si ii enervez pe toti cu fericirea mea!
http://www.cantaricrestine.ro
---> cu stima Trif
MarPlo Mesaje: 4343
Dupa cum ai in script, cautarea se face cu functia lookup(). Deci, apelezi functia asta la butonul prin care vrei sa faci cautarea, sau la evenimentul "onsubmit" in <form>.
De exemplu:

Cod: Selectaţi tot

<form action="cautare.php" method="post" onsubmit="lookup(); return false;">

Subiecte similare