2009-01-21 18 views
6

Ich möchte Felder dynamisch zu einem ASP.NET MVC-Formular mit JQuery hinzufügen.ASP.NET MVC & JQuery Dynamischer Formularinhalt

Beispiel:

<script language="javascript" type="text/javascript"> 
    var widgets; 

    $(document).ready(function() { 
     widgets = 0; 
     AddWidget(); 
    }); 

    function AddWidget() { 
     $('#widgets').append("<li><input type='text' name='widget" + widgets + "'/></li>"); 
     widgets++; 
    } 
</script> 

<ul id="widgets"> 
</ul> 

Dies funktioniert, aber ich wollte manuell die Form Werte in der Steuerung iterieren:

[AcceptVerbs("Post")] 
public ActionResult AddWidget(FormCollection form) 
{ 
    foreach (string s in form) 
    { 
     string t = form[s]; 
    } 

    return RedirectToAction("ActionName"); 
} 

Aber es fiel mir ein, wenn ich den Benutzer zurück auf die schicken Aktion im Controller abrufen Ich muss die FormData mit den eingegebenen Werten festlegen und anschließend iterativ die Widgets mit <% scripting hinzufügen.

Was ist der beste Weg, dies in der aktuellen Version zu tun (5 glaube ich)?

Antwort

4

Meine Lösung könnte so etwas wie dieses (Pseudo-Code) sein:

<script language="javascript" type="text/javascript"> 
    var widgets; 

    $(document).ready(function() { 
     widgets = 0; 
     <% for each value in ViewData("WidgetValues") %> 
      AddWidget(<%= value %>); 
     <% next %> 
    }); 

    function AddWidget(value) { 
     $('#widgets').append("<li><input type='text' name='widget" + widgets + 
          "'>" + value + "</input></li>"); 
     widgets++; 
    } 
</script> 

<ul id="widgets"> 
</ul> 

Und in der Steuerung:

[AcceptVerbs("Post")] 
public ActionResult AddWidget(FormCollection form) 
{ 
    dim collValues as new Collection; 
    foreach (string s in form) 
    { 
     string t = form[s]; 
     collValues.add(t) 
    } 
    ViewData("WidgetValues") = collValues; 
    return RedirectToAction("ActionName"); 
} 

Sie können die Details später ausrechnen
(sorry für VB Misch mit C#, ich bin ein VB Typ)

0

Ich könnte den Punkt hier fehlen, aber, müssen Sie tatsächlich die Daten zurück zum Controller über eine Formularaktion? Warum nicht einen Ajax-Anruf mit jQuery machen, um die Daten an den Controller zu senden ... oder besser noch einen Web-Service? senden Sie die Daten asynchron und müssen die Ansicht mit den Datenwerten nicht neu erstellen.

Dies funktioniert ordnungsgemäß, wenn die Werte konsumiert werden und nie wieder verwendet werden, wenn Sie jedoch planen, die Daten dauerhaft zu speichern und durch a Die Ansicht, Ihr Modell sollte die Datenstruktur wirklich unterstützen. vielleicht ein Dictionary<string, string> auf dem Modell.

+0

Scripting ist nicht wirklich akzeptabel zum Übermitteln von Formulardaten, die Anwendung muss ohne Scripting ordnungsgemäß abgebaut werden. – blu

+4

@blu Ha? Sie verwenden Javascript an erster Stelle, um die Steuerelemente zu erstellen; Wie würde dies würde mit js deaktiviert deaktiviert würde? – Aleris

+0

Ja, mein Kommentar macht keinen Sinn für diese Antwort. – blu

0

Ich bin kein Entwickler ASP.net, aber ich weiß von PHP, die Sie Arrays als Namen für Eingabefelder

Ex verwenden:

<input type="text" name="widgets[]" /> 
<input type="text" name="widgets[]" /> 

Sie können dann durchlaufen die Post variable Widgets als ob es eine Reihe von Werten wäre.

Keine um mit dynamicaly benannten Variablen usw. Messing

0

Soweit ich verstehe das Problem ist, die gebuchten Werte in Widgets zu bewahren. I thik können Sie nur diejenigen Widgets rendern, die Sie während des View-Renderings auf dem Server nicht ausfüllen.