Home/ Questions/Q 8252695
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-08T00:37:33+00:00

I am currently using Ajax to submit an input field without a page refresh

  • 0

I am currently using Ajax to submit an input field without a page refresh or button click. The function works well with a text input field But it doesnt work with posting the value of a select box and then php echoing the result. I check with the firebug tool and nothing is being posted by Ajax/js function.

How can I submit the value of a select box so I can then echo with the php? EXAMPLE

JS

<script>
$(document).ready(function() {
        var timer = null; 
        var dataString;   
          function submitForm(){
                         $.ajax({ type: "POST",
                         url: "index.php",
                         data: dataString,
                         success: function(result){
                         $('#item_input').text( $('#resultval', result).html()); 
                             }
                            });
                            return false;
           }
             $('#item_name').on('keyup', function() {
             clearTimeout(timer);
             timer = setTimeout(submitForm, 050);
             var name = $("#item_name").val();
             dataString = 'name='+ name;
          });
 }); 
</script>

PHP

<?php
      if ($_POST)
                {
                  $item_name     = $_POST['name'];
                  echo ('<div id="item_input"><span id="resultval">'.$item_name.'</span></div>');
                }
?>

HTML

<html>
<form method="post" id="form" name="form">  
<select name="item_name" value="<? $item_name ?>" size="4" id="item_name">
     <option value="">Item1</option>
     <option value="">Item2</option>
     <option value="">Item3</option>
     <option value="">Item4</option>
</select>
</form>
<div id="item_input"></div>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    select tags does not trigger keyup event , you should use change instead, try the following: 

     $('#item_name').on('change', function() {
     clearTimeout(timer);
     var name = $(this).val();
     dataString = 'name='+ name;
     timer = setTimeout(submitForm, 050);
 });


     $('#item_input').html(result);

    • 0