在jquery中更改另一个文本框时动态设置一个文本框值

Posted 2023-02-26

【中文标题】在jquery中更改另一个文本框时动态设置一个文本框值

【英文标题】：set one textbox value dynamically while change on another textbox in jquery

【发布时间】：2014-09-25 09:41:08

【问题描述】：

我正在尝试使用 jquery 执行类似 asp.net textchanged 事件。当我使用自动完成更改一个 tetbox 值时，另一个文本框会发生变化。数据将来自我的数据库。假设我有两个文本框 txtOne 和 TxtTwo。当我使用自动完成 txtTwo 值更改 txtone 时，数据库中的 accorindg 会更改为 txtOne。 这是我的代码。我究竟做错了什么？我如何在 mvc 的同一个文本框中实现 Autocomplete 和 Textchange 事件。

 @html.TextBoxFor(model => model.ITEMNM, htmlAttributes: new  @class = "form-control", id = "txtOne" )
 @Html.TextBoxFor(model => model.ITEMNM, htmlAttributes: new  @class = "form-control", id = "txtTwo" )

<script language="javascript" type="text/javascript">

    $(document).ready(function () 
        $('#txtOne').autocomplete(
        
            source: '@Url.Action("TagSearch", "RMS_ITEM")'
        );
    );

    $(function () 
        $('#txtOne').change(function () 
            var changedText = $("#txtOne").val();

            $.post('@Url.Action("ItemNameChanged","RMS_ITEM")',  "ChangedText": changedText );

        );
    );

</script>

这是我的控制器代码

[HttpPost]
public ActionResult ItemNameChanged(string changedText)

    var result = (from n in db.PosItemMstDbSet
                  where n.CATNM == changedText
                  select new
                  
                      catid = n.CATID

                  
                );

    foreach (var n in result)
    
        ViewBag.itemId = n.catid;
    
    //return changedText + " was submitted!";
    return null;


public JsonResult TagSearch(string term)

    var compid = Convert.ToInt16(System.Web.HttpContext.Current.Session["loggedCompID"].ToString());


    var tags = from p in db.PosItemMstDbSet
               where p.COMPID == compid
               select p.CATNM;

    return this.Json(tags.Where(t => t.StartsWith(term)),
                    JsonRequestBehavior.AllowGet);

【参考方案1】：

好吧，我已经解决了我的问题。谢谢大家...

这是我的脚本代码

<script language="javascript" type="text/javascript">

    $(document).ready(function () 
        $('#txtItemNm').autocomplete(
        
            source: '@Url.Action("TagSearch", "RMS_ITEM")',
            change: txtOneChanged
        );
    );

    function txtOneChanged()
    

        var changedText = $("#txtItemNm").val();
        var txtBox = document.getElementById('catid');



        $.getJSON(
        "/RMS_ITEM/ItemNameChanged",  "ChangedText": changedText ,
        function (myData) 
            txtBox.value = myData;
        );
    
</script>

这是我的控制器方法

[AcceptVerbs(HttpVerbs.Get)]
        public JsonResult ItemNameChanged(string changedText)
        
            var compid = Convert.ToInt16(System.Web.HttpContext.Current.Session["loggedCompID"].ToString());
            var itemId = "";



            var rt = db.PosItemMstDbSet.Where(n => n.CATNM == changedText &&
                                                         n.COMPID == compid).Select(n => new
                                                         
                                                             catid = n.CATID
                                                         );
            foreach (var n in rt)
            
                itemId = n.catid;
            
            return Json(itemId, JsonRequestBehavior.AllowGet);

        

        public JsonResult TagSearch(string term)
        
            var compid = Convert.ToInt16(System.Web.HttpContext.Current.Session["loggedCompID"].ToString());


            var tags = from p in db.PosItemMstDbSet
                       where p.COMPID == compid
                       select p.CATNM;

            return this.Json(tags.Where(t => t.StartsWith(term)),
                            JsonRequestBehavior.AllowGet);
        

【参考方案2】：

您需要为自动完成调用定义change 选项：

$("#txtOne").autocomplete(

  source: '@Url.Action("TagSearch", "RMS_ITEM")'
  change: txtOneChanged
);

function txtOneChanged()

    // your custom code

查看这个 JSFiddle：

http://jsfiddle.net/w1vs0rqn/

【讨论】：

非常感谢！另一个问题，我如何捕获 json 数据并使用从我的控制器返回的 jquery 将其设置到我的文本框？