在Ajax.ActionLink的中间运行javascript函数

Question

这是问题所在：我有一个Ajax.ActionLink（），其中需要从文本框中为routeValues提供一个值：

@Ajax.ActionLink("Purchase Tracking", "StatusOfFactor", "Shopping", new { guid = HERE I WANT A JAVASCRIPT FUNCTION TO RETRIEVE VALUE FROM TEXTBOX } , ajaxOptions: new AjaxOptions { UpdateTargetId = "StatusOfFactor", HttpMethod = "GET", InsertionMode = InsertionMode.Replace }, htmlAttributes: new { @class = "btnpeyment btn btn-xs bg-color-btn" })

我应该如何实施？

Answer 1

$('#textBoxID').on('change', function(event){
   var value = $('#textBoxID').val();
   $('#ajaxLinkID').attr('guid', value);
})

用您正在使用的ID替换ID。

注意：如果文本框是通过AJAX调用放置在页面上的，则您将需要使用事件委托来完成此工作，并将其委托给最初加载到页面上的父容器。

Answer 2

您可以替换Ajax.ActionLink并自己编写一些javascript代码以实现所追求的目标。

首先，我们将Ajax操作链接替换为普通锚标签

<a id="purchasTrackingLink" class="btnpeyment"
                    href="@Url.Action("StatusOfFactor","Shopping")">Purchase Tracking</a>
<input id="YourTextBoxId" />

现在连接此链接上的click事件，防止出现默认行为，读取文本框的值并将其用于生成新的目标url，并将其用于ajax调用。

$(function(){

   $("#purchasTrackingLink").click(function(e){

       e.preventDefault();

       var textBoxVal=$("#YourTextBoxId").val();
       var url=$(this).attr("href");
       url=url+"?guid="+textBoxVal;
       //Now make the ajax call
       $.get(url,function(response){
          $("#StatusOfFactor").html(response);
       });

   });

});