JQuery没有获得select对象的值

时间:2013-01-24 11:42:20

标签: php jquery

我在弹出窗口中使用两个动态对象(一个是Select,另一个是单选按钮)。然后调用它们的值来传递Ajax函数。但由于一些未知的原因,它不起作用。当我删除单选按钮时,它工作正常。

用于生成对象的PHP代码:

$submit_newform=
'<form method="POST">
<div id="waiting" style="display:none; font-weight:bold">Please wait ...</div><br />
<table width="100%" border="0" cellspacing="3" cellpadding="3">
  <tr><td colspan="4"><h1>Add Component Itinerary</h1></td></tr>
  <tr>`
    <td width="25">Service:</td>

    <td width="25">
    <select name="cmb_service" id="cmb_service" class="dropdown2">
    <option value="">-Select-</option>';
    foreach($services as $k=>$v)
    $submit_newform.= "<option value=".$k.">".$v."</option>";

    $submit_newform.= '</select></td>

    </tr>;


 $submit_newform.='<tr><td><input type="radio" name="package" id="package" value="package"` `class="packagetype" onClick="callservice_provider();">Package</input></td><td><input` `type="radio" name="package" id="package" value="nopackage" class="packagetype"` `onClick="callpackages();">Without Package</input></td></tr></table></form>';

和jquery部分如下:

$(document).ready(function() {

        $('input.packagetype').click( function( event ){
            var value = $(this).val();
            if(value =="package")
                {
                    alert("show package");
                }
            else
            {
                var destination = $("#destination").val();
                var service_val = $(cmb_service).val();
                   alert(destination+"+"+service_val);
                $.ajax({
                        type : 'POST',
                        url : '../enquiries/getpricebyajax',
                        dataType : 'json',
                        data: {
                                service : service_val,
                                destno : destination
                        },
                        success : function(data) {
                               alert("success");
                               $('#divserviceprovider').text('');
                               $('#divserviceprovider').append(data.msg);
                               $('#divserviceprovider').show(500);
                               if (data.error === true)
                                    $('#divserviceprovider').show(500);
                        },
                        error : function(XMLHttpRequest, textStatus, errorThrown) {
                            alert("success");
                                $('#waiting').hide(500);
                                $('#divserviceprovider').removeClass().addClass('error')
                                    .text('There was an error.').show(500);
                                $('#divserviceprovider').show(500);
                        }
                });
                return false;
            }
        });
});

对象selectradio button都无法协同工作。请建议我。

提前致谢。

5 个答案:

答案 0 :(得分:1)

我假设您想要该下拉列表的选定值?

$("#cmb_service option:selected").val();

答案 1 :(得分:0)

您的输入

<input type="radio" name="package" id="package" value="package"` `class="packagetype" onClick="callservice_provider();">Package</input>

我认为输入没有结束标签(据我所知)

<input type="radio" name="package" id="package" value="package" class="packagetype" onClick="callservice_provider();" />Package

你在jquery中有onclick内联函数和click事件......我想知道......为什么会这样???为什么你不能把这两件事都放在一起......在您的callservice_provider()函数或jquery click事件中。

我想你错过了这里的哈希

$('#cmb_service').val();

答案 2 :(得分:0)

您的代码存在一些缺陷

1)您不能为两个控件提供相同的ID。您已为这两个单选按钮添加了id="package"

2)在Ajax中,

var service_val = $(cmb_service).val();

这一行应该引发恐怖。您无法像这样访问ID。您必须访问

var service_val = $("#cmb_service").val();

再次检查您的代码。

答案 3 :(得分:0)

我已经修改了你的代码,希望这有助于

<html>
    <head>
    <title></title>
    <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script>
    $(document).ready(function() {

        $('input.packagetype').click( function( event ){
            var value = $(this).val();
            if(value =="package")
                {
                    alert("show package");
                }
            else
            {
                var destination = $("#destination").val();
                var service_val = $("#cmb_service").val();
                   alert(destination+"+"+service_val);
                $.ajax({
                        type : 'POST',
                        url : '../enquiries/getpricebyajax',
                        dataType : 'json',
                        data: {
                                service : service_val,
                                destno : destination
                        },
                        success : function(data) {
                               alert("success");
                               $('#divserviceprovider').text('');
                               $('#divserviceprovider').append(data.msg);
                               $('#divserviceprovider').show(500);
                               if (data.error === true)
                                    $('#divserviceprovider').show(500);
                        },
                        error : function(XMLHttpRequest, textStatus, errorThrown) {
                            alert("success");
                                $('#waiting').hide(500);
                                $('#divserviceprovider').removeClass().addClass('error')
                                    .text('There was an error.').show(500);
                                $('#divserviceprovider').show(500);
                        }
                });
                return false;
            }
        });
});
    </script>

    </head>
    <body>
        <?php

        $services =array('apple','orange','grapes');
$submit_newform=
'<form method="POST">
<div id="waiting" style="display:none; font-weight:bold">Please wait ...</div><br />
<table width="100%" border="0" cellspacing="3" cellpadding="3">
  <tr><td colspan="4"><h1>Add Component Itinerary</h1></td></tr>
  <tr>`
    <td width="25">Service:</td>

    <td width="25">
    <select name="cmb_service" id="cmb_service" class="dropdown2">
    <option value="">-Select-</option>';
    foreach($services as $k=>$v)
    $submit_newform.= "<option value=".$k.">".$v."</option>";

    $submit_newform.= '</select></td>

    </tr>;';


 $submit_newform.='<tr><td><input type="radio" name="package" id="package" value="package" class="packagetype" onClick="callservice_provider();">Package</input></td><td><input type="radio" name="package" id="nopackage" value="nopackage" class="packagetype" onClick="callpackages();">Without Package</input></td></tr></table></form>';
 echo $submit_newform;
        ?>
    </body>
</html>

我想提一些事情。

  1. 请勿对单选按钮使用相同的id
  2. 我刚看到警报,现在就可以了。
  3. 如果您还需要其他信息,请告诉我

答案 4 :(得分:0)

$submit_newform.='<tr><td><input type="radio" name="package" id="package"// same id
                  value="package"` `class="packagetype" 
                  onClick="callservice_provider();">Package</input></td> //</input>
              //--^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^---------^^^^^^^----bad closing
                 <td><input` `type="radio" name="package" id="package" // same id
                 value="nopackage" class="packagetype"
                 onClick="callpackages();">Without Package</input></td>
                </tr></table></form>';

如果您点击此处的特定广播,那么您不需要内联onclick处理程序:

$('input.packagetype').click( function( event ){

和你的其他部分:

var service_val = $(cmb_service).val();

应该是:

var service_val = $("#cmb_service").val();

所以你的最终代码必须是这样的:

$submit_newform.='<tr><td><input type="radio" name="package" id="package1"
                  value="package"` `class="packagetype"/>Package
                  </td> 
                 <td><input type="radio" name="package" id="package2" 
                 value="nopackage" class="packagetype"/>Without Package
                 </td>
                </tr></table></form>';

的jQuery:

$(document).ready(function () {

$(document).on('click', 'input.packagetype', function (event) {
    var value = $(this).val();
    if (value == "package") {
        alert("show package");
    } else {
        var destination = $("#destination").val();
        var service_val = $("#cmb_service").val();
        alert(destination + "+" + service_val);
        $.ajax({
            type: 'POST',
            url: '../enquiries/getpricebyajax',
            dataType: 'json',
            data: {
                service: service_val,
                destno: destination
            },
            success: function (data) {
                alert("success");
                $('#divserviceprovider').text('');
                $('#divserviceprovider').append(data.msg);
                $('#divserviceprovider').show(500);
                if (data.error === true) $('#divserviceprovider').show(500);
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert("success");
                $('#waiting').hide(500);
                $('#divserviceprovider').removeClass().addClass('error')
                    .text('There was an error.').show(500);
                $('#divserviceprovider').show(500);
            }
        });
        return false;
    }
});
});