同時選擇和編輯數據的解決方案

Question

我在c＃中有一個asp.net應用程序。

我有一個SQL Server數據庫中的表有兩個字段：

Field1 
Comments 

我需要允許用戶選擇Field1和特定Field1

添加註釋，用戶會再交輸入回服務器

我該如何做到這一點？我可以使用哪種控制？有沒有一個簡單的jQuery解決方案？

Answer 1

這完全取決於您的網站設置。但是，如果您有一個Field1值列表並將它們放入DropDownList中，則可以選擇一個並在框中添加註釋。

這也很大程度上取決於您的用戶界面/工作流程。這只是許多可能的方法之一。

代碼前

<asp:DropDownList ID="ddlField1" runat="server"> 
    <asp:ListItem>Value1</asp:ListItem> 
    <asp:ListItem>Value2</asp:ListItem> 
    <asp:ListItem>Value3</asp:ListItem> 
    <asp:ListItem>Value4</asp:ListItem> 
</asp:DropDownList> 
<asp:TextBox ID="tbComments" runat="server" TextMode="MultiLine"></asp:TextBox> 
<asp:Button ID="btSubmit" runat="server" OnClick="btSubmit_Click"></asp:Button> 

<asp:SqlDataSource ID="sqlRecord" runat="server" 
    InsertCommand="InsertRecord" InsertCommandType="StoredProcedure"> 
    <InsertParameters> 
     <asp:Parameter Name="Field1" Type="String" /> 
     <asp:Parameter Name="Comment" Type="String" /> 
    </InsertParameters> 
</asp:SqlDataSource> 

代碼背後

public void btSubmit_Click(object sender, EventArgs e) 
{ 
    // Do your validation of the data here 
    .. 

    // Add fields and insert 
    sqlRecord.InsertParameters["Field1"].DefaultValue = ddlField1.SelectedValue; 
    sqlRecord.InsertParameters["Comment"].DefaultValue = tbComment.Text; 
    sqlRecord.Insert(); 
} 

這是未經測試和部分僞代碼，但應該讓你在一般的非MVC的Web應用程序的正確方向。此外，這不使用任何JavaScript/jQuery，只是ASP.NET和C＃。

Answer 2

我會把可能選擇在下拉，然後使用jQuery做一個JSON請求以從控制器的數據，然後有一個保存按鈕，它調用另一個JavaScript函數發佈修改後的數據反饋給控制器。

控制器：

public ActionResult GetFields() 
{ 
var model=new MyModel(); 
model.Selections =(from m in database.table select m.Field1).ToList(); 
return View(model); 
} 

public ActionResult GetComments(string field1) 
{ 
return Content((from c in database.table where(c.Field1==field1)select c.Comments).First()); 
} 

[HttpPost] 
public void SaveComments(string field1, string comments) 
{ 
var record=(from r in database.table where(r.Field1==field1)select r).First(); 
record.Comments=comments; 
database.SaveChanges; 
return; 
} 

觀點：

<script type="text/javascript> 
function SaveComments(){ 
var url='@Url.Action("GetComments","YourControllerName"); 
url+='?field1='+$('#selections option:selected').text(); 
$('#selectedField').text($('#selections option:selected').text()); 
$('#commentEditor').load(url); 
}; 

function SaveComments(){ 
var url='@Url.Action("SaveComments","YourControllerName")'; 
url+='?field1='+$('#selections option:selected').text()+'&comments='+$('#commentEditor').text(); 
$('#dummy').load(url); 
}; 
</script> 

<select id="selections" onchange="SelectionChanged()"> 
@foreach(var item in Model.Selections) 
{ 
<option value="@item">@item</option> 
} 
</select> 
<div id="selectedField"/> 
<input type="text" id="commentEditor"/> 
<input type="button" value="apply" onclick="SaveComments()"/> 
<div id="dummy"/> 

免責聲明：有可能在這個小錯誤（通常不會寫在文本框中大塊的代碼：P），你應該不應該使用啞元div，並且您將需要在視圖模型上有一個List，它的get返回基於Selections中的值。這應該給你一個總體思路。