0

我正在使用 jQuery 1.7.2 和 jQuery UI 1.8.20。我的一个页面，我有一个简单的对话框，其中包含一个表单：

    <div id="dialog-addArtToCompetition" title="Add Art to Competition">
    <form id="addToCompetition" name="addToCompetition"
        action="${competition_new_base}" method="post">
        <fieldset>
            <input type="hidden" name="artPieceId" id="artPieceIdHidden" value="${artPiece.id}" />
            <label for="artCategoryId">Category: </label> 
            <select name="artCategoryId" id="artCategoryIdSelect"
                multiple="false" style="width: 200px; height: 50px;">
            </select> <br />
            <label for="competitionPrice">Price: </label>
            <select name="competitionPrice" id="competitionPriceSelect"
                multiple="false" style="width: 200px; height: 50px;">
            </select>
        </fieldset>
    </form>
</div>

然后我使用以下内容注册对话框：

            $('#dialog-addArtToCompetition').dialog({
            autoOpen:   false,
            width:      400,
            height:     500,
            modal:      true,
            buttons:    {
                "Add":  function() {
                    $('#addToCompetition').ajaxSubmit({
                        accept:         'application/json',
                        dataType:       'json',
                        //beforeSubmit: showRequest,  // pre-submit callback 
                        success:        function(comp, statusText, xhr, $form) {
                            alert("Art added");
                            $(this).dialog( "close" );
                        },
                        error:          function(xhr, ajaxOptions, thrownError) {
                            alert("Some error occured");
                            $(this).dialog( "close" );
                        },
                        resetForm:      true
                    }); 

                    $(this).dialog( "close" );
                },
                "Cancel":   function() {
                    $(this).dialog( "close" );
                }
            },
            close:      function() {}
        });
    });

但是，当我打开对话框时，缺少第二个元素。我仔细检查了生成的 HTML 购买查看源代码，原始 HTML 文件确实缺少选择，但是当我使用 Chrome 的开发工具查看它时，元素标签中缺少它。而且，是的，我正在查看正确的 DIV，因为我知道 jQuery 在您创建对话框时会将其移到正文中。

为什么 jQuery 会删除我的表单元素？

4

1 回答 1

0

空的选择似乎有些奇怪。一旦我进行了以下更改

<div title="Add Art to Competition" id="dialog-addArtToCompetition">
<form method="post" action="/ArtSite/competitions/new" name="addToCompetition" id="addToCompetition">
    <fieldset>
        <input value="" id="artPieceIdHidden" name="artPieceId" type="hidden"/>
        <label for="artCategoryId">Category: </label>
        <select style="width: 200px; height: 50px;" multiple="false" id="artCategoryIdSelect" name="artCategoryId"><!-- empty --></select><br/>
        <label for="competitionPrice">Price: </label>
        <select style="width: 200px; height: 50px;"  multiple="false" id="competitionPriceSelect" name="competitionPrice"><!-- empty --></select>
    </fieldset>
</form>

​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​</p>

这一切似乎都奏效了。

于 2012-08-17T23:45:44.293 回答