隐藏表格提交后选择单选按钮的表格行

时间:2013-03-08 19:32:57

标签: javascript jquery ajax form-submit cfml

我有表格中包含的表格。该表是从CF循环构建的,我在其中为每个行ID分配了sql表中的NumberID。我有一个提交按钮,执行jquery ajax提交。我需要隐藏已提交的行而不是重新加载页面。

    <form id="unsortedTable" >
    <input type="submit"   id="makeParentButton" value="Make Parent">
    </span>
    <div class="row-fluid"><p></p>
    <table class="table table-bordered table-striped table-hover">


        <tbody>
      <cfloop query="nonAffiliated">

          <tr id="#NumberID#">
            <td><input type="radio"  name="NumberID" value="#NumberID#"></td>
          </tr>
      </cfloop>
      </tbody>
      </table>
      </div>
 </form>  

然后我有执行提交时触发的JavaScript。

    $(document).ready(function(e) {
    $("#unsortedTable").submit(sendForm);

    });

    function sendForm() {
       var row = $(this).closest('tr');
        $.post('handlers/formHandler.cfm',
        $("#unsortedTable").serialize(),function(data,status){
        $("#unsortedTable")[0].reset();

        row.hide(); //This is just a guess
    });
    return false


 }

除了我无法将提交的行隐藏()之外,一切正常。

1 个答案:

答案 0 :(得分:0)

除非表单在您尝试隐藏的表格行中,否则$(this).closest('tr')将找不到该行。您可能认为$(this)确实引用了单击的按钮,但您在表单上使用了子句柄处理程序,而不是按钮上的单击处理程序。

您可能希望以id或首先找到按钮的方式找到不同的行:

$('#rowId').hide();

$('#buttonId').closest('tr').hide();

编辑:

在更仔细地重新阅读您的问题后,我意识到您不希望隐藏提交按钮,而是单选按钮。为此你可以这样做:

$(this).find('input:radio:checked').closest('tr').hide();