post selextbox values to php page in jquery_问答_开发者

post selextbox values to php page in jquery

开发者 https://www.devze.com 2023-01-03 21:33 出处：网络

I am using jquery button click to post all the values in a selectbox to a PHP page, but this code does not seem to work. Can anyone please help?

相关专题：jquery php

I am using jquery button click to post all the values in a selectbox to a PHP page, but this code does not seem to work. Can anyone please help?

<script type="text/javascript">
$(function() {
    $("#btn1").click(function () {
      var arr= new Array; 
       $("#target_select option").each (function () { 
                    // You can push the array on an array 
                    arr.push( $(this).val() ); 
                //alert(  $(this).val()  ); not getting the alert to display too
                    });
      $.post("test.php", { name: arr } );
    });
});开发者_如何学C

</script>

Generate

You have to make sure that the page you are $.post()-ing to is on the same domain. Also, $.post() is not a way to submit a form, it's an Ajax call that does not load the new page over the current page. So this works for me, loading the results of the POST into the body of the page.

<html>
<head>
<title>Test Page</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"
    type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {

$("#btn1").bind('click', function () {
    var arr= []; 
    $("#target_select option").each (function () { 
        arr.push( $(this).val() );
    });
    $.post("post.php", { 'name': arr }, function(data){
        $('body').append(data);
    } );
});

});
</script>
</head>
<body>
<form method="POST" action=".">
    <select name="target_select" id="target_select">
        <option value="option1">option1</option>
        <option value="option2">option2</option>
        <option value="option3">option2</option>
    </select>
    <input type="button" value="btn1" id="btn1" />
</form>
</body>
</html>

Here's what I have in post.php:

<?php

print "<pre>";
print_r($_POST);
print "</pre>";

?>

When I do this, I get this appended to my page:

Array
(
    [name] => Array
        (
            [0] => option1
            [1] => option2
            [2] => option3
        )

)

Try

arr.push( $(this).attr('value') );

instead

Try using the .attr("value") instead of .val(). I can't remember if .val() works on <option> tags, but I'm thinking not.

<script type="text/javascript">
$(function() {
    $("#btn1").click(function () {
      var arr= new Array; 
       $("#target_select option").each (function () { 
                    // You can push the array on an array 
                    arr.push( $(this).attr("value") ); 
                //alert(  $(this).attr("value")  ); not getting the alert to display too
                    });
      $.post("test.php", { name: arr } );
    });
});

</script>

- EDIT -

I found the same as Art (comment below) when I was putting together that jsFiddle.

.attr("value") and .val() are the same on <option> tags.

I would delete this answer, but I think people may benefit from the clarification posted in the comments and whatnot (since there is another answer stating the same).