Как передать значения полей ввода формы в скрипт, используя AJAX / jQuery?

Question

Мой текущий код такой:

index.php

<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="ajax.js"></script>

<select id="dropdown_id">
<option value="one.php">One</option>
<option value="two.php">Two</option>
</select>

<div id="workspace">workspace</div>

one.php

$arr = array ( "workspace" => "One" );
echo json_encode( $arr );

two.php

$arr = array( 'workspace' => "Two" );
echo json_encode( $arr );

JS

jQuery('#dropdown_id').live('change', function(event) {
    jQuery.getJSON($(this).val(), function(snippets) {
        for(var id in snippets) {
            // updated to deal with any type of HTML
            jQuery('#' + id).html(snippets[id]);
        }
    });
});

Над кодом работает отлично.Когда я выбираю One из выпадающего списка, one.php загружается в рабочую область DIV с использованием JSON.Когда я выбираю Two, два.php загружается в рабочую область DIV.

Что я хочу сделать дальше:

Now I want to add another dropdown in index.php:
<select id="myinput" name="alpha">
  <option value="a">a</option> 
  <option value="b">b</option>
  <option value="a">c</option>
  <option value="b">d</option>
</select>

Когда пользователь выбирает любую опцию из первого выпадающего списказатем этот скрипт (значение) должен быть загружен со значением второго раскрывающегося списка в рабочей области DIV.

Например:

Когда я выбираю Один из первого раскрывающегося списка:

one.php

$arr = array ( "workspace" => $_GET['alpha'] ); // Should load 'a'
echo json_encode( $arr );

Теперь, когда я выбираю b из второго раскрывающегося списка, тогда:

one.php

$arr = array ( "workspace" => $_GET['alpha'] ); // Should load 'b'
echo json_encode( $arr );

Answer 1

Я надеюсь, что это может помочь вам:

one.php

$arr = array ( 'workspace' => 'One');
if(isset($_GET['myinput_val']))
{
     $arr['workspace'] = $_GET['myinput_val'];
}
echo json_encode( $arr );

JS

$('#myinput').live('change', function(event) {
$.getJSON("one.php", { myinput_val: $(this).val() } , function (snippets) {
    for(var id in snippets) {
        // updated to deal with any type of HTML
        $('#' + id).html(snippets[id]);
    }
});
});

Answer 2

Как насчет чего-то вроде:

$('#mypage').bind('change', function () {
    var self = $(this);

    $('#workspace').load('/' + self.val(), {
        input: $('#myinput').val();
    });
});

Тогда ваши PHP-файлы будут искать значение $ _POST ['input'] для вывода значения.

<?php echo $_POST['input']; ?>