Изменение ячейки WebGrid в текстовом поле

-1

У меня есть набор данных, и я должен отображать его в веб-приложении. Вот то, что набор данных выглядит следующим образом:Изменение ячейки WebGrid в текстовом поле

Point_ID Project No. Project Manager Comments 
A007  1304   Oscar Duran  Found destroyed 
A008  1304   Oscar Duran  Helicopter access 
A009  1356   Julio Bravo  Airport parking lot

Вот что у меня есть для моего кода:

@{ 
var db = Database.Open("ControlPoints");            
var SelectCommand = "SELECT * FROM AllControlMergedWD";      
var SearchTerm = "";                 

if(!Request.QueryString["SearchCP"].IsEmpty()){          
    SelectCommand = "SELECT * FROM AllControlMergedWD WHERE Point_ID = @0";   
    SearchTerm = Request.QueryString["SearchCP"];         
} 

if(!Request.QueryString["SearchProject"].IsEmpty()){        
    SelectCommand = "SELECT * FROM AllControlMergedWD WHERE [Project Used on] LIKE @0"; 
    SearchTerm = "%" + Request["SearchProject"] + "%"; 
} 

var SelectData = db.Query(SelectCommand, SearchTerm);        
var grid = new WebGrid(source: SelectData, rowsPerPage: 10);       
} 

<!DOCTYPE html> 

<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>Airborne Imaging Control Points Database</title> 

    <style type="text/css"> 
     .grid { margin: 4px; border-collapse: collapse; width: 600px; } 
     .grid th, .grid td { border: 1px solid #C0C0C0; padding: 5px; } 
     .head { background-color: #E8E8E8; font-weight: bold; color: #FFF; } 
     .alt { background-color: #E8E8E8; color: #000; }         
    </style> 

</head> 
<body> 
    <h1>Airborne Imaging Control Points Database</h1><br/><br/>        
    <form method="get"> 
     <fieldset>                 
      <legend>Search Criteria</legend>           
      <div> 
       <p><label for="SearchCP">Control Point ID:</label>     
       <input type="text" name="SearchCP" value="@Request.QueryString["SearchCP"]" placeholder="Leave blank to list all"/> 
       <input type="submit" value="Search"/></p>        
      </div> 
      <div> 
       <p><label for="SearchProject">Project:</label>       
       <input type="text" name="SearchProject" value="@Request.QueryString["SearchProject"]" /> 
       <input type="Submit" value="Search" /></p> 
      </div> 
     </fieldset> 
    </form> 
    <div> 
     @grid.GetHtml(               
      tableStyle: "grid",             
      headerStyle: "head",             
      alternatingRowStyle: "alt",           
      columns: grid.Columns(
       grid.Column("Point_ID"), 
       grid.Column("Project No."), 
       grid.Column("Project Manager"), 
       grid.Column("Comments", format: @<text>@Html.TextBox("Comments")</text>) 
      ) 
     ) 
     <br/><br/> 
    </div> 
</body> 
</html>

То, что я пытаюсь сделать, это превращение клеток «Комментарии» в виде элементов (текст), так что любой, кто имеет доступ к Приложению, сможет добавлять комментарии, редактировать или обновлять статусы текущего состояния точек. Не могли бы вы помочь мне в этом?

Благодарим вас заблаговременно.

UPDATE

я смог добавить поле текстового поля в колонке «Комментарии» (я обновил свой код, указанный выше). Теперь у меня осталось сохранение комментариев, которые вводятся в базу данных.

источник

2015-01-26 Oscar Duran

Возможный дубликат [Добавить столбцы динамически в Grid-view с помощью itemtemplate] (http://stackoverflow.com/questions/23592785/add-columns-dynamically-to-grid-view-with-itemtemplate) – phillip

Я пытался чтобы применить ответ в указанной вами ссылке, но я не думаю, что это относится к веб-страницам asp.net. –

я был в состоянии решить мою проблему. Вот эти изменения, которые я сделал в мой WebGrid:

<div> 
     @grid.GetHtml(                  
      tableStyle: "grid",                
      headerStyle: "head",                
      alternatingRowStyle: "alt",              
      columns: grid.Columns(
       grid.Column("", format: @<text> 
        <button class="edit-comment display-mode" id="@item.Point_ID">Edit</button>   
        <button class="save-comment edit-mode" id="@item.Point_ID">Save</button> </text>), 
       grid.Column("Point_ID", "Point ID"), 
       grid.Column("Project No.", "Project No"), 
       grid.Column("Project Used on"), 
       grid.Column("WGS84 Lat"), 
       grid.Column("WGS84 Long"), 
       grid.Column("Ellips_Ht"), 
       grid.Column("Project Manager"), 
       grid.Column("Comments", format: @<text> 
        <span id="comments" class="display-mode">@item.Comments</span>        
        @Html.TextBox("Comments", item.Comments, new {@class="edit-mode", size = 45}) </text>)  
      ) 
     ) 
     <br/><br/> 
    </div>

Как вы можете видеть, я добавил новую колонку для хранения кнопок, и к Комментариям колонок Я добавил срок и форму. Затем я добавил следующий скрипт для переключения между режимами и добавлять события к кнопкам:

<script> 
     $(function() { 
      $('.edit-mode').hide();         
      $('.edit-comment').on('click', function() {    
       var tr = $(this).parents('tr:first');    
       tr.find('.edit-mode, .display-mode').toggle();  
      }); 
      $('.save-comment').on('click', function() {    
       var tr = $(this).parents('tr:first');    
       var point_ID = $(this).prop('id');     
       var comments = tr.find('#Comments').val();   
       $.post(
        '/EditComments', 
        { Point_ID: point_ID, Comments: comments },  
        function (updatespan) { 
         tr.find('#comments').text(updatespan.Comments); 
        }, "json"); 
       tr.find('.edit-mode, .display-mode').toggle();  
      }); 
     }) 
    </script>

Наконец, я создал EditComments, который обновляет базу данных и извлекает обратно обновление для отображения:

@{ 
    var point_ID = Request["Point_ID"];      
    var comments = Request["Comments"];      
    var db = Database.Open("ControlPoints");     
    var sql = "UPDATE AllControlMergedND SET Comments = @0 WHERE Point_ID = @1"; 
    db.Execute(sql, comments, point_ID);      

    sql = @"SELECT * FROM AllControlMergedND WHERE Point_ID = @0"; 
    var result = db.QuerySingle(sql, point_ID);    
    Json.Write(result, Response.Output);      
}

Все это мне удалось сделать благодаря блоге я нашел в следующей ссылке:

http://www.mikesdotnetting.com/article/202/inline-editing-with-the-webgrid

Процедуры очень хорошо объясняются в блоге.

источник

2015-02-03 16:21:12

Эй Оскар ты просил меня, чтобы предоставить вам ответ ...

Я не код ASP.NET Razor этот путь. На мой взгляд, вы должны научиться его кодировать с помощью моделей, представлений и контроллеров. То, что у вас здесь, - очень плохая практика. Один файл со всем в нем нехорошо делать.

Но, чтобы ответить на ваш вопрос конкретно ... Я укажу вам на этот урок, который показывает, как делать то, что вы хотите, с помощью webgrid.

http://www.dotnetfunda.com/articles/show/2727/using-webgrid-to-populate-data-as-gridview-in-aspnet-mvc-razorview

источник

2015-01-29 21:45:29 phillip

Он не использует MVC. Он использует [веб-страницы ASP.Net] (http://www.asp.net/web-pages). Хотя я не согласен, использование MVC в большинстве случаев превосходит веб-страницы. –

Ответы должны быть автономными и не полагаться на ссылки на внешние веб-сайты. Если эта связь когда-либо сломается, решение этой проблемы будет потеряно для всех, кто находит этот вопрос. Вы должны включить соответствующую информацию из ссылки в свой ответ. – mason

Я знаю, что должен, но он попросил меня ответить конкретно ... так что я дал ему ответ ... – phillip

Вы можете указать формат столбца WebGrid

<div> 
    @grid.GetHtml(               
     tableStyle: "grid",             
     headerStyle: "head",             
     alternatingRowStyle: "alt",           
     columns: grid.Columns(
      grid.Column("Point_ID"), 
      grid.Column("Project No."), 
      grid.Column("Project Manager"), 
      grid.Column("Comments", @<text>@Html.TextBox("Comments")</text>) 
     ) 
    ) 
    <br/><br/> 
</div>

источник

2015-01-30 01:40:34

Привет, ваше решение работало очень хорошо, когда я изменил его на следующее: 'grid.Column (« Комментарии », формат: @ @ Html.TextBox (« Комментарии »)). Теперь я могу видеть текстовое поле и писать в нем, но я не могу сохранить комментарии в базе данных. Какие-либо предложения? –

Привет, Оскар, чтобы сохранить комментарии в базе данных, - это еще один вопрос, на который ответить непросто. Вы можете пометить мой ответ как разрешенный и задать другой вопрос. –

Спасибо за помощь. Я бы определенно отметил этот ответ, но он не разрешил все представленные проблемы. –

Изменение ячейки WebGrid в текстовом поле

ответ

Смежные вопросы