2

これは私の最初の投稿ですので、お手柔らかにお願いします。jquery オートコンプリートを利用する作成フォームを実装しようとしています。作成フォームを使用すると、ユーザーは送信ボタンを使用して、データベースに保存されるデータを入力できます。これが私のコードです：

コントローラ

    // GET: /Inspection1/Create
    public ActionResult Create()
    {
        InspectionInfo model = new InspectionInfo
        {
            Submitted = DateTime.Now,
            Contact = new Contact()
        };

        ViewBag.CountyName = new SelectList(db.Counties, "CountyName", "CountyName");


        return View(model);
    }

    //
    // POST: /Inspection1/Create

    [HttpPost]
    public ActionResult Create(InspectionInfo inspectioninfo)
    {
            if (ModelState.IsValid)
        {
            db.InspectionInfos.Add(inspectioninfo);
            db.SaveChanges();
            return RedirectToAction("Index");
        }

        return View(inspectioninfo);
    }

    // this allows for autocompletion behavior
    public ActionResult QuickSearchContact(string term)
    {
        var contacts = db.Contacts
                        .Where(r => r.ContactName.Contains(term))
                        .Take(10)
                        .Select(r => new { label = r.ContactName });
        return Json(contacts, JsonRequestBehavior.AllowGet);

    }

モデル

  public class InspectionInfo
  {
    [Key]
    public int InspectionId { get; set; }

    [DataType(DataType.Date)]
    public virtual DateTime Submitted { get; set; }
    [DataType(DataType.MultilineText)]
    [MaxLength(1000)]
    public string Comments { get; set; }

    [Required]
    public Contact Contact { get; set; }


 public class Contact
 {
    [Key]
    public string ContactName { get; set; }

意見：

<div class="editor-label">
        @Html.LabelFor(model => model.Contact)
    </div>
    <div class="editor-field">
        <input type ="text" name ="q" data-autocomplete=  
       "@Url.Action("QuickSearchContact", "Inspection")"/> 
        @Html.ValidationMessageFor(model => model.Contact.ContactName)
    </div>

JS

$(document).ready(function () {

  $(":input[data-autocomplete]").each(function () {

  $(this).autocomplete({ source: $(this).attr("data-autocomplete")});
  });

オートコンプリート機能は正常に動作しているようです。必要に応じて、データベースから列データを取得します。ただし、オートコンプリート テキスト ボックスに入力されたデータは、ユーザーがフォームを保存した後、データベースに NULL として表示されます。ここで助けていただければ幸いです。

4

3 に答える 3

1

モデル バインドが機能するには、通常、入力名がモデルのプロパティ名と一致する必要があります。驚いたことに、入力に「q」という名前を付けました

<input type ="text" name ="q" data-autocomplete="..."/>

モデルに合わせて名前を変更するだけです

<input type ="text" name="Contact.ContactName" data-autocomplete="..."/>
于 2012-10-19T20:16:34.363 に答える
0

The provided information doesn't tell, but is is likely that the autocomplete part is not written within the form elements of the view:

    @using (Html.BeginForm()) 
    {
        <p>
            ...
        </p>
     }

In MVC the form is defined within the brackets { .... } like above.

于 2012-10-19T20:19:44.500 に答える
0

上記のコードにはありませんが、使用する代わりに

 <input type ="text" name ="q" data-autocomplete=          "@Url.Action("QuickSearchContact", "Inspection")"/>

使用: @EditorFor(x = x.NameOfTextBox)

次に、入力ボタンを using タグでラップします。

@using (Html.BeginForm("Create", "NameOfController", FormMethod.Post){

 //all your model stuff goes here

}

または、代わりに および actionlink を使用します。

@Html.ActionLink("Submit", "Create", "NameOfController", Model)
于 2012-10-19T20:17:56.253 に答える