文本框鼠标在MVC中的Javascript

I have a text box and Button in MVC that by clicking the button controller action is called and other code in Jquery are also called. I wonder how can I replace this button with mouse out of the textbox. So all these action happen when user type something in text box and try to go to the next text box.

我在MVC中有一个文本框和Button,通过单击按钮控制器操作被调用,并且还调用Jquery中的其他代码。我想知道如何用鼠标移出文本框来替换这个按钮。因此,当用户在文本框中键入内容并尝试转到下一个文本框时,所有这些操作都会发生。

this is my MVC view code to create text box and Button:

这是我创建文本框和Button的MVC视图代码:

Offer ID:
@Html.TextBoxFor(model => model.ID, new { id = "ID" })

 <button id="btnSearch" data-url="@Url.Action("GetOffer", "LookUp")" class="btn btn-success search pull-left">Search</button>

this is the Jquery function that is call by clicking the button:

这是通过单击按钮调用的Jquery函数:

<script type="text/javascript">
  $(function () {

    $("#btnSearch").click(function (evt) {
        evt.preventDefault();
        var url = $(this).data('url');

        getByOfferId(url);
    }
    );
});

I am not sure how specify this code in text box:

我不确定如何在文本框中指定此代码:

 data-url="@Url.Action("ActioName", "controllerName")"

and what action to call instead of this line:

以及要调用的行动而不是此行:

    $("#btnSearch").click(function (evt) {

1 个解决方案

#1

Instead of mouseout, handle the .change() event of the textbox. You can add the url to the textbox using

而不是mouseout,处理文本框的.change()事件。您可以使用以下方法将URL添加到文本框中

@Html.TextBoxFor(m => m.ID, new { data_url = "Url.Action("GetOffer", "LookUp")" })

Note the id attribute of the textbox will be id="ID" by default (generated by the html helper) so that you not need new { id = "ID" }. Then the script can be

请注意,默认情况下,文本框的id属性将为id =“ID”(由html帮助程序生成),因此您不需要新的{id =“ID”}。然后脚本可以

$("#ID").change(function () {
    var url = $(this).data('url');
    getByOfferId(url);
}

alternatively you can just use (without the data-url attribute) assuming the script is not in a separate file.

或者你可以使用(没有data-url属性)假设脚本不在一个单独的文件中。

$("#ID").change(function () {
    var url = '@Url.Action("GetOffer", "LookUp")';
    getByOfferId(url);
}

#1