jQuery的自动完成和MVC

Question

在我的部分观点我有姓，名和用户名外地

<tr> 
    <td> 
     <b>Last Name</b><span class="red">*</span> 
    </td> 
    <td> 
     @Html.TextBoxFor(model => model.LastName, new { id = "txtLastName" }) 
     @Html.ValidationMessageFor(model => model.LastName) 
    </td> 
</tr> 
<tr> 
    <td> 
     <b>First Name</b><span class="red">*</span> 
    </td> 
    <td> 
     @Html.TextBoxFor(model => model.FirstName, new { id = "txtFirstName" }) 
     @Html.ValidationMessageFor(model => model.FirstName) 
    </td> 
</tr> 
<tr> 
    <td> 
     <b>User Name</b><span class="red">*</span> 
    </td> 
    <td> 
     @Html.TextBoxFor(model => model.UserName, new { id = "txtUserNameAdd" }) 
     @Html.ValidationMessageFor(model => model.UserName) 
    </td> 
</tr> 

现在我有自动完成用户名

$('#txtUserNameAdd').autocomplete({ 
     source: '/AdminSearchResult/UserNameList?fullName=' + $('#txtFirstName').val() + " " + ('#txtLastName').val() 
    }); 

在我的控制器

public ActionResult UserNameList(string term, string fullName) 
{    
    // my code 

    return Json(result, JsonRequestBehavior.AllowGet); 
} 

当部分视图被加载时，屏幕上有名字，姓氏和用户名。 用户输入名字和姓氏。基于名字和姓氏输入用户名称列表（来自活动目录）成为自动完成下拉数据的来源。

在控制器我得到了我的方法长期价值，但由于存在的document.ready过程中的姓氏和名字没有价值我不明白全名

fullname is ($('#txtFirstName').val() + " " + ('#txtLastName').val()) 

我想到的价值我想这种替代

$(document).ready(function (e) { 

    $('#txtUserNameAdd').autocomplete({ 
     source: '/AdminSearchResult/UserNameList?fullName=' + getFullname() 
    }); 

}); 

function getFullname() { 
    var lastName = document.getElementById('txtLastName').value; 
    var firstName = document.getElementById('txtFirstName').value; 

    return firstName + " " + lastName; 
} 

这也给我没有价值的全名。

有人能帮我得到全名的价值吗？

Answer 1

我希望这可以帮助别人，即使这个问题很老。首先，在您的示例中，您继续参考
+（'#txtLastName'）。val（）而不是$（'＃txtLastName'）。val（）。

如果您尝试对您遗漏的$进行修正，那么您的字符串应该正确解析为字段值，但这不会修改您的自动完成值，而且自动填充方法不会接受动态查询字符串，因此最好这样来做：

http://jquery.toitl.com/?p=2012/11/03/164155/autocomplete_with_parameter

，或者创建处理上提交请求的功能：在你的jQuery准备 ：

//Initialize the autocomplete with jQuery options which submits on Select of item 
var InitAutoComplete = function() { 
var $input=$(this); 
var options = { 
    source: '/Index/Autocomplete', 
    select: submitForm 
    }; 
$input.autocomplete(options); 
}; 

var ajFormSubmital = function(){ 
var $form= ($this); // the passed in form 
var options = { 
url: 'some url', 
type: 'GET', 
data: $form.serialize() 
}; 

// Now do some ajax stuff in the same scope standard ajax 
$.ajax(options).done(function(data) { 
var $target = $($form.find('#myspan')); //don't let the $$ fool you, one variable is named $form 
//now replace the target with the data 
$newData=$(data); //Grab the data returned by the ajax call 
$target.replaceWith($newData); 
} 
return false; // we don't want the form to post directly 

// create a submit form method 
var submitForm = function (e,ui) { 
var $input=$(this); //the autocomplete input field 
$input.val(ui.item.label); //The label contains the text value can also be obtained per jQuery specs 
$input.parents("form:first").submit(); 
} 

// remember to name your variables in your controller. 
// the controller will receive 'term' and also the 
// form fields will be serialized and the will have the names you assign 
// in your model, not the field Ids. So concatenate in your model 
// and return a json string 
// Wire up the form submit event to your form in your ready event 
// Wire up the autocomplete field to your your InitAutoComplete method. 
// you will wire up in the $(function() {}) - don't use $(document).ready()  
// it does not work for the ajax call after the second and even-number post  backs 
// $('#myform').submit(ajFormSubmital); 
//$('#myAutocomplete').each(InitAutoComplete); 
// Tweak the above code and you should be able to use this in any form.