2013-08-04 53 views
2

我试图从已使用jquery Autocomplete填充的文本框中传递选定项目的值。这是我到目前为止有:JQuery自动完成未将值传递给MVC控制器

<script type="text/javascript"> 

     $(function() { 
      var userId = $('#userID').val(); 
      //http://techbrij.com/987/jquery-ui-autocomplete-asp-net-web-api 
      $("#autocomplete").autocomplete({ 
       source: function (request, response) { 
        $.ajax({ 
         url: "/api/Friends/" + userId, 
         type: 'GET', 
         cache: false, 
         data: request, 
         dataType: 'json', 
         success: function (json) { 
          // call autocomplete callback method with results 
          response($.map(json, function (name) { 
           return { 
            label: name.FullName, 
            value: name.FriendID 
           }; 
          })); 
         }, 
         error: function (XMLHttpRequest, textStatus, errorThrown) { 
          $("#autocomplete").text(textStatus); 
         } 
        }); 
       }, 
       select: function (event, ui) { 
        alert('you have selected ' + ui.item.label + ' ID: ' + ui.item.value); 
        $('#autocomplete').val(ui.item.label); 
        return false; 
       }, 
       messages: { 
        noResults: '', 
        results: function() { 
        } 
       } 
      }); 
     }); 

    </script> 

查看

@using (Html.BeginForm()) { 
    @Html.AntiForgeryToken() 
    @Html.ValidationSummary(true) 
    <fieldset> 
     <legend>MailMessage</legend> 
     <div class="editor-label"> 
      @Html.LabelFor(model => model.Recipient.ID) 
     </div> 
     <div class="editor-field"> 
      <input type="text" id="autocomplete" /> 
     </div> 
     <div class="editor-label"> 
      @Html.LabelFor(model => model.Subject) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.Subject) 
      @Html.ValidationMessageFor(model => model.Subject) 
     </div> 
     <div class="editor-label"> 
      @Html.LabelFor(model => model.Message) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.Message) 
      @Html.ValidationMessageFor(model => model.Message) 
     </div> 

     <p> 
      <input type="submit" value="Create" /> 
     </p> 
    </fieldset> 
} 

控制器

[HttpPost] 
public ActionResult Compose(MailMessage mailMessage) 
{ 
    mailMessage.MailDate = DateTime.Now; 
    mailMessage.Recipient = UserManager.GetFullUser(mailMessage.Recipient.ID); 
    mailMessage.Sender = SDSession.SDUser; 
    mailMessage.MessageId = Guid.NewGuid(); 

    MailMessageManager.AddMailMessage(mailMessage); 
    return View("Inbox"); 
} 

这是一个减少的版本,但它说明了问题。它可以很好地从api获取数据,我选择所需的用户,然后点击提交按钮,但在控制器内,它期望有一个MailMessage对象,因此对于我在自动填充中选择的用户,没有任何内容会传递给我,我应该将名称属性添加到文本框中,还是有更好的方法来做到这一点?

回答

3

尝试用自动完成ID替换您的输入标签,并使用以下行。

@Html.TextBoxFor(model => model.Recipient.ID, new { @id="autocomplete" }) 

这会解决您的问题。

+0

谢谢,这工作。我需要做一个其他更改以保留此框中的名称,并将该ID添加到隐藏字段中,但HTML助手是我缺少的关键。 – christiandev