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.