help needed in retrieving the value of a jquery ui combobox?

help needed in retrieving the value of a jquery ui combobox?

i would like to retrieve using php $_post, the inputted value of a combobox. i have been searching all over Google for several days now for examples however i cannot seem to find anything. if someone could post an example of this it would be great.

thanks in advance, please let me know if i can provide more information to you assist me
here is my code

  1. <?php 
  2. //this is where i want to echo the inputted and or selected combobox value
  3. if (isset($_POST['submit'])){
  4.       echo $_POST['combobox'];    
  5. }
  6. ?>
  7. <head>
  8. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  9. <link rel="stylesheet" type="text/css" href="css/jquery-ui-1.8.1.custom.css" />
  10. <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
  11. <script type="text/javascript" src="js/jquery-ui-1.8.1.custom.min.js"></script>
  12. <script type="text/javascript">
  13.     (function($) {
  14.         $.widget("ui.combobox", {
  15.             _create: function() {
  16.                 var self = this;
  17.                 var select = this.element.hide();
  18.                 var input = $("<input>")
  19.                     .insertAfter(select)
  20.                     .autocomplete({
  21.                         source: function(request, response) {
  22.                             var matcher = new RegExp(request.term, "i");
  23.                             response(select.children("option").map(function() {
  24.                                 var text = $(this).text();
  25.                                 if (this.value && (!request.term || matcher.test(text)))
  26.                                     return {
  27.                                         id: this.value,
  28.                                         label: text.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(request.term) + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>"),
  29.                                         value: text
  30.                                     };
  31.                             }));
  32.                         },
  33.                         delay: 0,
  34.                         change: function(event, ui) {
  35.                             if (!ui.item) {
  36.                                 // remove invalid value, as it didn't match anything
  37.                                 $(this).val("");
  38.                                 return false;
  39.                             }
  40.                             select.val(ui.item.id);
  41.                             self._trigger("selected", event, {
  42.                                 item: select.find("[value='" + ui.item.id + "']")
  43.                             });
  44.                        },
  45.                         minLength: 0
  46.                     })
  47.                     .addClass("ui-widget ui-widget-content ui-corner-left");
  48.                 //i changed this line cause it was refreshing on its own when placed inside a form tag
  49.                   $("<div type='button'>&nbsp;</div>")
  50.                 .attr("tabIndex", -1)
  51.                 .attr("title", "Show All Items")
  52.                 .insertAfter(input)
  53.                 .button({
  54.                     icons: {
  55.                         primary: "ui-icon-triangle-1-s"
  56.                     },
  57.                     text: false
  58.                 }).removeClass("ui-corner-all")
  59.                 .addClass("ui-corner-right ui-button-icon")
  60.                 .click(function() {
  61.                     // close if already visible
  62.                     if (input.autocomplete("widget").is(":visible")) {
  63.                         input.autocomplete("close");
  64.                         return;
  65.                     }
  66.                     // pass empty string as value to search for, displaying all results
  67.                     input.autocomplete("search", "");
  68.                     input.focus();
  69.                 });
  70.             }
  71.         });
  72.     })(jQuery);
  73.     $(function() {
  74.         $("#combobox").combobox();
  75.         $("#toggle").click(function() {
  76.             $("#combobox").toggle();
  77.         });
  78.     });
  79.     </script>
  80. </head>


<body>

<div class="ui-widget">
    <form id="form1" name="form1" method="post" action="">
      <label>Your preferred programming language: </label>
<select name="combobox" id="combobox" >
      <option value="">Select one...</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select>
  <input type="submit" name="submit" id="button" value="Submit" />
  </form>
</div>

</body>
</html>























    • Topic Participants

    • gavi