I use autocomplete to populate a textbox in a jquery datatables grid. Sometimes the string returned is longer than the textbox. Once it is selected I do not see the beginning of the string, I only see the end. One solution would be to truncate the string selected so it never is too long for the textbox. But this could confuse the user.
Is there a better way?
<tr @if (Model != null) {
@:data-pkey='@Html.AttributeEncode(Model.TimeEntryRowID)'
} >
<td style = "width:380px">
@Html.TextBoxFor(x => x.JobDescription, new { @class = "JobDescriptionList", style = "width:370px;text-align:left;" })
@Html.HiddenFor(x => x.JobName, new { @class = "JobName"})
</td>
$(".JobDescriptionList").autocomplete({
source: arrayJobs,
minLength: 2,
mustMatch: true,
select: function (event, ui) {
var $input = $(this);
var TABKEY = 9;
if (event.keyCode == TABKEY) {
// tabout was not moving to next box
$input.next('input').focus();
}
},
change: function (event, ui) {
if (ui.item) {
var $input = $(this);
//var contractShort = GetContractShortened(ui.item.value);
var contract = ui.item.value;
$input.val(contract);
var $jobName = $input.closest("td").find(".JobName");
var contractNo = GetContractNo(contract);
$jobName.val(contractNo);
}