तालिका पंक्ति

Question

का प्रतिनिधित्व करने के लिए आंशिक दृश्य का उपयोग करके मैं अपनी परियोजना में किसी तालिका की पंक्तियों का प्रतिनिधित्व करने के लिए आंशिक दृश्य का उपयोग करने का प्रयास कर रहा हूं। मैं वर्तमान में

<table> 
    <thead> 
     <tr> 
      <th > 
       Column 1 
      </th> 
      <th > 
       Column 2 
      </th> 
      <th > 
       Column 3 
      </th> 
     </tr> 
    </thead> 
    <tbody> 
     @foreach(var item in Model.Items) 
     { 
     @Html.Action("ItemCalculatedView", new { Id = item.Id}) 
     } 
    </tbody> 
    </table> 

है मेरी आंशिक ध्यान में रखते हुए मैं इस

@using (Ajax.BeginForm("SaveStuff", "Whatever", 
    new { id = @Model.Id }, new AjaxOptions() 
    { 
     HttpMethod = "Post", 
     OnSuccess = "Success" 
    })) 
    { 
    @Html.HiddenFor(m => m.Id) 
    <tr> 
     <td> 
      @Html.Label("Col1", Model.Col1) 
     </td> 
     <td> 
      @Html.TextBox("Number", Model.Number) 
     </td> 
     <td> 
      <input type="submit" id='submit-@Model.Id'/> 
     </td> 
    </tr>   
    } 

मैं कैसे यह काम कर सकते हैं?

Answer 1

आप एक मेज सेल अंदर एक रूप में रख सकते हैं, लेकिन आप एक tbody तत्व, या एकाधिक स्तंभों में फैले अंदर प्रपत्र नहीं हो सकता। तो तीन विकल्प हैं:

1. किसी तालिका के बजाय एक सीएसएस लेआउट का उपयोग करें, या CSS display set to "table" के साथ divs का उपयोग करें। (for example)
2. पूरा फ़ॉर्म रखो (पाठ बॉक्स और सबमिट) एक td
3. अंदर td तत्व के अंदर एक और तालिका रखो

मैं सलाह देते हैं # 1 - टेबल को एक सीएसएस लेआउट का उपयोग

मुख्य

<div class="table"> 
    <div class="header-row"> 
     <div class="header-cell">Column 1</th> 
     <div class="header-cell">Column 2</th> 
     <div class="header-cell">Column 3</th> 
    </div> 

    @foreach(var item in Model.Items) 
    { 
     @Html.Action("ItemCalculatedView", new { Id = item.Id}) 
    } 
</div> 

0: है, क्योंकि यह table टैग शैली मुश्किल है

आंशिक

@using (Ajax.BeginForm(
    actionName: "SaveStuff", 
    controllerName: "Whatever", 
    routeValues: new { id = @Model.Id }, 
    ajaxOptions: new AjaxOptions 
    { 
     HttpMethod = "Post", 
     OnSuccess = "Success" 
    }, 
    htmlAttributes: new { @class = "row" } 
)) 
{ 
    <div class="cell"> 
     @Html.HiddenFor(m => m.Id) 
    </div> 
    <div class="cell"> 
     @Html.Label("Col1", Model.Col1) 
    </div> 
    <div class="cell"> 
     @Html.TextBox("Number", Model.Number) 
    </div> 
    <div class="cell"> 
     <input type="submit" id='submit-@Model.Id'/> 
    </div> 
} 

सीएसएस

.table { display: table; } 
.header-row, row { display: table-row; } 
.header-cell, cell { display: table-cell; } 

Answer 2

आप कई मुद्दों यहाँ है। सबसे पहले, जैसा कि dbaseman उल्लेख करता है, आप एक तालिका की संरचना के भीतर रूपों को नहीं रख सकते हैं और यह कानूनी HTML है। यह काम कर सकता है, या ऐसा नहीं हो सकता है, और यहां तक ​​कि अगर यह काम करता है, तो आप गारंटी नहीं दे सकते कि यह काम जारी रहेगा।

मैं इसके बजाय फॉर्म में अपनी तालिका लपेटूंगा, और उसके बाद पोस्ट को पता लगाया जाएगा कि कौन सा बटन उसके मूल्य और/या इंडेक्स के आधार पर दबाया गया था।

मैं दृढ़ता से टैब्यूलर डेटा के लिए सीएसएस टेबल का उपयोग करने के खिलाफ सलाह दूंगा। यह सिर्फ अर्थात् सही नहीं है।

अजाक्स। बेगिनफॉर्म का उपयोग करने के बजाय, एक और संभावित समाधान है, इसके बजाय jQuery $ .ajax का उपयोग करें और फिर आप सर्वर पर पोस्ट करने के लिए जावास्क्रिप्ट में डेटा की एक पंक्ति का चयन कर सकते हैं।