更改提交按钮关闭按钮

如果表单提交成功，我如何更改按钮的行为？更改提交按钮关闭按钮

<form method="post" enctype="multipart/form-data" style="margin: 0;" id="frmGenerate"> 
    <div class="clearfix"> 
     <div class="input-group"> 
      <input type="text" placeholder="Customer Name:" name="CustomerName"> 
      <input type="text" placeholder="Generated Url:" name="CustomerUrl" readonly="readonly" /> 
     </div> 
    </div> 
    <div class="clearfix"> 
     <div class="input-group"> 
      <button type="submit" class="btn">Generate</button> 
     </div> 
    </div> 
</form>

这里是我的JS代码：

$('#frmGenerate').submit(function(e) { 
     var clientName = $(this).find('input[name="CustomerName"]').val(); 
     $.ajax(
      { 
       url: '@Url.Action("GenerateToken","Admin")', 
       type: 'GET', 
       data: { customerName: clientName }, 
       success: function(response) { 
        if (response.result) { 
         $('#frmGenerate').find('input[name="CustomerUrl"]').val(response.message).select(); 
         $('#frmGenerate').find('button.btn').text('Close'); 
        } else { 
         alert(response.message); 
        } 
       } 
      }); 
     e.preventDefault(); 
    });

这是模态窗口，我打开生成的令牌。当它生成成功，然后我设置生成的模式输入令牌和更改文本的按钮关闭，但我不知道如何更改按钮的行为。

来源

2014-07-22 user3770925

你是什么意思按钮的行为？你能告诉我细节吗？你想要按钮做什么？ – Mahder

@Mahder，我想使用模式窗口firstle上的按钮提交表单，然后当提交成功时，只需关闭模式窗口onclick按相同的按钮。这里的解决方法就像使用2个按钮（一个用于提交，另一个用于关闭，只需切换它们）。但如果有任何使用1按钮2选项的话，如果你明白我的意思。谢谢 – user3770925

我会建议隐藏这个按钮使用$（“。btn [type ='submit']”）。hide（）并创建另一个关闭按钮。 –

更好的方法是不改变现有的按钮，但隐藏并显示另一个。

HTML：

<div class="clearfix"> 
    <div class="input-group"> 
     <button type="submit" class="btn">Generate</button> 
     <button type="button" class="btn btn-close hide">Close</button> 
    </div> 
</div>

JS：

$('#frmGenerate').find('.btn').hide(); 
$('#frmGenerate').find('.btn-close').show();

来源

2014-07-22 11:11:44 dfsq

谢谢，我知道这个解决方案，如果你认为这样更好，那么我会用它） – user3770925

这更好，因为你有更多的灵活性。你可以很容易地有不同的风格。 Javascript代码不与表示混合。 – dfsq

取决于您正在使用的按钮类型。钮必须使用，如：<button></button>不喜欢<button/>

然后用：

$(".btn").html('Close');

来源

2014-07-22 11:11:22 XIMRX

我使用'' – user3770925

你可以改变按钮的属性

$('#frmGenerate').find('button.btn').attr('type', 'button');

然后：

$('#frmGenerate').find('button.btn').on('click', function(){ /*close function */});

来源

2014-07-22 11:20:41

我发现在提交表单后，您已将您的按钮的文本更改为“关闭”。所以剩下的部分是处理按钮上的点击事件的jQuery。

....

 $('.btn').click(function(){ 
     var buttonText = $(this).val(); 
     if(buttonText === 'Close'){ 
     //code when close button is clicked 
     }else if(buttonText === 'Generate'){ 
      //code when Generate button is clicked... 
     } 
     });//end button.click function

而且我会用输入类型= '按钮' 或按钮比输入类型= '提交'。为什么不使用ajax提交表单？好多了。

希望这有助于...

来源

2014-07-22 11:22:04 Mahder

是的，这也是解决方案，但不是很好.. – user3770925

更改提交按钮关闭按钮

回答

相关问题