Uzyskiwanie wartości opcji bez przesyłania formularza

Chcę użyć wartości wybranej przez użytkownika bez przedkładania formularza. Oto mój kod HTMLUzyskiwanie wartości opcji bez przesyłania formularza

Combo Box<br> 
<select name="select1"> 
<option value="IVP" selected>IVP</option> 
<option value="SURTEK">SURTEK</option> 
<option value="GUITARTUNER">GUITARTUNER</option> 
<option value="OTHER">OTHER</option> 
</select>

chcę wziąć wartość wybranej opcji do zmiennej php, tak, że w zależności od wartości opcji nowy zestaw danych może zostać wyświetlona. Dzięki

Źródło

2013-03-01 Harsh

bez javascript jej nie możliwe, –

Co jesteś próba zrobienia jest prosta z PHP. Czy na pewno nie szukasz kodu JavaScript? – aaaaaa123456789

Sprawdź to może być pomocna http://stackoverflow.com/questions/9170453/display-dropdown-values-based-on-previous-dropdown – Hkachhia

Nie można uzyskać wartości opcji w zmiennej php, bez wykonywania żądania http, ponieważ wybrana wartość leży w kliencie, a php - w serwerze.

Możesz użyć ajax, ale wciąż przesyła formularz. Jeśli nie chcesz wykonywać kwerend na serwer, musisz załadować wszystkie dane w kliencie i użyć JavaScriptu do zarządzania nim

Źródło

2013-03-01 08:38:15

Jak mogę to zrobić z ajaxem? i czy strona musi się załadować, nawet jeśli używam ajax? – Harsh

Użyj AJAX, podczas wybierania opcji w rozwijanym menu wywołaj funkcję jQuery i wysyłaj wartości na stronie serwera AJAX

strona HTML:

<html> 
<head> 
<script> 
function showUser(str) 
{ 
if (str=="") 
    { 
    document.getElementById("txtHint").innerHTML=""; 
    return; 
    } 
if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    {// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET","getuser.php?q="+str,true); 
xmlhttp.send(); 
} 
</script> 
</head> 
<body> 

<form> 
<select name="users" onchange="showUser(this.value)"> 
<option value="">Select a person:</option> 
<option value="1">Peter Griffin</option> 
<option value="2">Lois Griffin</option> 
<option value="3">Glenn Quagmire</option> 
<option value="4">Joseph Swanson</option> 
</select> 
</form> 
<br> 
<div id="txtHint"><b>Person info will be listed here.</b></div> 

</body> 
</html>

strona PHP (getuser.php):

<?php 
$q=$_GET["q"]; 

$con = mysql_connect('localhost', 'peter', 'abc123'); 
if (!$con) 
    { 
    die('Could not connect: ' . mysql_error()); 
    } 

mysql_select_db("ajax_demo", $con); 

$sql="SELECT * FROM user WHERE id = '".$q."'"; 

$result = mysql_query($sql); 

echo "<table border='1'> 
<tr> 
<th>Firstname</th> 
<th>Lastname</th> 
<th>Age</th> 
<th>Hometown</th> 
<th>Job</th> 
</tr>"; 

while($row = mysql_fetch_array($result)) 
    { 
    echo "<tr>"; 
    echo "<td>" . $row['FirstName'] . "</td>"; 
    echo "<td>" . $row['LastName'] . "</td>"; 
    echo "<td>" . $row['Age'] . "</td>"; 
    echo "<td>" . $row['Hometown'] . "</td>"; 
    echo "<td>" . $row['Job'] . "</td>"; 
    echo "</tr>"; 
    } 
echo "</table>"; 

mysql_close($con); 
?>

Ref: http://www.w3schools.com/php/php_ajax_database.asp

Źródło

2013-03-01 08:39:31

To jest przykład javascript, ale zalecam używanie jquery AJAX –

'$ .ajax' jQuery zmniejsza liczbę linii do 2 do 3 linii. – asprin

@asprin: Tak Dokładnie :) –

jak sugerowali inni ludzie, powinieneś używać AJAX. Polecam zajrzeć do przykładów javascript/Jquery wywołania AJAX.

Domyślam się, że chcesz zmodyfikować część sieci w zależności od opcji wybranej przez użytkownika, najlepszym sposobem na to jest posiadanie oddzielnego skryptu PHP, który odbiera wybraną opcję (przechwycony w javascript/JQuery) i zwraca nowy HTML, który chcesz wyświetlić.

Na przykład w jQuery aby uzyskać wybraną opcję:

var selected_option_value=$("#select1 option:selected").val();

Również w jQuery zrobić wywołanie AJAX, przekazując wartość za pomocą POST:

$.post("script_that_receives_value.php", {option_value: selected_option_value}, 
     function(data){ //this will be executed once the `script_that_receives_value.php` ends its execution, `data` contains everything said script echoed. 
      $("#place_where_you_want_the_new_html").html(data); 
     } 
);

nadzieję, że to pomaga!

EDIT: dajmy nieco więcej szczegółów na powyższym przykładzie:

powiedzmy masz stronę index.html gdzie masz <select name="select1"> podane w pytaniu:

pierwszym krokiem byłoby powiązać zdarzenie gdy ktoś wybrać jedną z opcji, jak to zrobić:

1- Pierwszy sposób to zrobić:

<select name='select1' id='select1' onchange='load_new_content()'>

ten sposób gdy ktoś zmieni wybraną wartość z listy <select>, zostanie wykonana funkcja javascript load_new_content(). Uwaga Dodałem do tagu id='select1', który jest używany do wyszukiwania tego elementu w javascript/JQuery. Zawsze powinieneś używać atrybutu id, jeśli chcesz użyć tego znacznika w javascript/JQuery.

2- Drugi sposób powiązać zdarzenie przy użyciu jQuery:

Aby to zrobić trzeba mieć <script> tag wewnątrz <head> z index.html. Wewnątrz tej <script> tag powinien mieć:

$(document).ready(function(){ 
     // everything here will be executed once index.html has finished loading, so at the start when the user is yet to do anything. 
     $("#select1").change(load_new_content()); //this translates to: "when the element with id='select1' changes its value execute load_new_content() function" 
});

Niezależnie opcja chcesz użyć teraz trzeba to load_new_content() funkcję. Powinien być również zadeklarowany wewnątrz znacznika <script> znacznika <head>, podobnie jak funkcja $ (document) .ready.

function load_new_content(){ 
    var selected_option_value=$("#select1 option:selected").val(); //get the value of the current selected option. 

    $.post("script_that_receives_value.php", {option_value: selected_option_value}, 
     function(data){ //this will be executed once the `script_that_receives_value.php` ends its execution, `data` contains everything said script echoed. 
       $("#place_where_you_want_the_new_html").html(data); 
       alert(data); //just to see what it returns 
     } 
    ); 
}

Teraz jedyne co pozostało, to ten script_that_receives_value.php:

<?php 
    $selected_option=$_POST['option_value']; 

    //Do what you need with this value, then echo what you want to be returned. 

    echo "you have selected the option with value=$selected_option"; 
?>

Źródło

2013-03-01 08:48:45 Naryl

Cześć Naryl, czy możesz wyjaśnić to nieco. Jestem nowy w Jquery i AJAX – Harsh

hmm ok, pozwól mi edytować, aby dać trochę więcej informacji. – Naryl

Dziękuję za to Naryl, ale utknąłem w tym miejscu: "Zrób to, czego potrzebujesz z tą wartością, a następnie powtórz to, co chcesz odzyskać." $ selected_option = $ _ POST ['option_value']; \t $ q = "WYBIERZ * Z PRODUKTÓW WHERE id = '2'"; \t $ r = mysqli_query ($ dbc, $ q); \t $ data = mysqli_fetch_assoc ($ r); \t \t jeśli ($ selected_option = '1') { \t \t $ price = $ data ['cost1']; \t} else { \t \t \t if ($ selected_option '2') == { \t \t \t $ $ dane kursowe = [ 'cost2']; \t \t} else { \t \t \t if ($ selected_option '3') == { \t \t \t $ $ dane kursowe = [ 'cost3']; \t \t} else { \t \t \t if ($ selected_option == '4') { \t \t \t $ $ dane kursowe = [ 'cost4']; \t \t}}}} \t \t return $ price; – DeathGrip

Jeśli szukasz dynamicznej zawartości stron internetowych Ajax jest najlepszym rozwiązaniem

Źródło

2013-03-01 09:14:12

Uzyskiwanie wartości opcji bez przesyłania formularza

Odpowiedz

Powiązane problemy