jQuery:清除Html.TextBox上的表单输入,然后刷新页面

时间:2014-08-07 14:16:27

标签: asp.net-mvc html-helper

我发现这个JSFiddle从输入中清除了文本? http://jsfiddle.net/xavi3r/D3prt/

如何在MVC中使用razor View中的Html.TextBox,然后刷新页面?

到目前为止,我的解决方案就是这个(它有效):

@{
Layout = "~/Views/Shared/_Layout.cshtml";
}

<script type="text/javascript">
$(function () {
    //this part clean text from textboxes
    $('#button').click(function () {
        $(':input', '#form')
            .not(':button, :submit, :reset, :hidden')
            .val('')
            .removeAttr('checked')
            .removeAttr('selected');
    });
    //this part submit my search button - it is like refresh button, returns state as it was in begin - this is the same as I click on search without entering parameters
    $('#button').click(function () {
        document.myForm.onSubmit.click();
    });
});
</script>

using (Html.BeginForm("Index", "LoginUser", FormMethod.Get, new { id = "form", name = "myForm"}))
{
<div class="form-group">
    @Html.TextBox("order", Model.Search.Order, new { placeholder="Luška št.", id ="quantity1", @class="quantity form-control"})

<button type="submit" class="btn btn-primary" name="onSubmit">Search</button>
<input type="button" class="btn btn-primary" value="Clear" id="button" />  

</div>
}

在_Layout中:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.validate.min.js"></script>
<script type="text/javascript" src="~/scripts/jquery.validate.unobtrusive.min.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script type="text/javascript" src="~/Scripts/bootstrap.min.js"></script>

真的感谢您的帮助......

1 个答案:

答案 0 :(得分:2)

您的视图将像html一样呈现:

<div class="form-group">
    <input type="text" name="order" id="quantity1" placeholder="Luška št." class="quantity form-control" value="SomeValue" />
    <input type="button" />
</div>

您可以使用以下代码执行此操作:

$(function () {

    $('.form-group input:button').click(function () {
        $('input#quantity1').val('');
    });

});