Как получить значение из пользовательского интерфейса jQuery, выбираемого в php

Question

Здравствуйте, я создал этот список, который меняет цвет при выборе элемента с помощью пользовательского интерфейса jQuery.

<ol id="selectable"> 
     <li class="ui-widget-content" Name ='gender' value= 'male1'>Item 1</li> 
     <li class="ui-widget-content" Name ='gender' value= 'male2'>Item 2</li> 
     <li class="ui-widget-content" Name ='gender' value= 'male3'>Item 3</li> 
     <li class="ui-widget-content" Name ='gender' value= 'male4'>Item 4</li> 
     <li class="ui-widget-content" Name ='gender' value= 'male5'>Item 5</li> 
     <li class="ui-widget-content" Name ='gender' value= 'male6'>Item 6</li> 
     <li class="ui-widget-content" Name ='gender' value= 'male7'>Item 7</li> 
    </ol> 

<Input type = "Submit" Name = "Submit1" VALUE = "Select a Radio Button"> 

http://jsfiddle.net/szNh3/2/

Ho я отправить/получить выбранный элемент в файле PHP?

Answer 1

Слегка модифицированный сегмент от jQuery UI documentation

$(function() { 
    $("#selectable").selectable({ 
     stop: function() { 
      var result = $("#select-result").empty(); 
      $(".ui-selected", this).each(function() { 
       var index = $("#selectable li").index(this); 
       // send an AJAX request to a PHP file 
       $.get('myphpfile.php', { 
        selectedIndex: index 
       }, function(data) { 
        // do stuff with the results from PHP 
       }); 

      }); 
     } 
    }); 
}); 

EDIT

Чтобы сделать это с вашей кнопки

$(function() { 
    $("#selectable").selectable(); 

    $("submit[name=Submit1]").click(function() { 
     var index = $("#selectable li").index($("#selectable")); 
     $.get('myphpfile.php', { 
      selectedIndex: index 
     }, function(data) { 
      // do stuff with the results from PHP 
     }); 
    }); 
});