gridview question asp.net and c#

Saroj13
Saroj13 used Ask the Experts™
on
Hi,

I have gridview.  I am displaying ID, Title, Text in columns in gridview. On page load, text column is not displaying anything.

How to achieve if click on Title, will display the corresponding text in Text column in gridview.

Please see the picture and code:

<head runat="server">
    <title></title>
  
      <script src="../scripts/jquery-1.6.1.js" type="text/javascript"></script>  
      <script src="../scripts/jquery.tablednd_0_5.js" type="text/javascript"></script>  
    <style>  

        .noselect  

         {  

             -webkit-user-select: none;  

             -khtml-user-select: none;  

             -moz-user-select: none;  

             -o-user-select: none;  

             user-select: none;  

             cursor: move;  

         }  

         .tDnD_whileDrag  

         {  

             background-color: Lime;  

         }  

        .style3
        {
            height: 8px;
        }
        .style5
        {
            height: 2px;
        }

        .style6
        {
            height: 24px;
        }
        .style7
        {
            height: 1px;
        }

        </style>  

     <script type="text/javascript">  

var strorder;  

 $(document).ready(function() {

     $('#ScriptsGridView').tableDnD(  

 {  

     onDrop: function(table, row) {  

     reorder();  

     $.ajax({  

              type: "POST",

              url: "ScriptOrder.aspx/GridViewReorders",

              data: '{"Reorder":"' + strorder + '"}',  
              

              contentType: "application/json; charset=utf-8",  

              dataType: "json",  

              async: true,  

              cache: false,  

              success: function (msg) {  

              alert("Successfully Save ReOrder");  

              }  

    

            })  

      }  

 }  

 );  

 });  

 function  reorder()  

 {   

     strorder="";

     var totalid = $('#ScriptsGridView tr td input').length;  

     for(var i=0;i<totalid;i++)  

     {

         strorder = strorder + $('#ScriptsGridView tr td input')[i].getAttribute("value") + "|";  

     }  

 }  

     </script>  

  
</head>
<body>
      <form id="frmOrderScript" runat="server">
         <table>
           <tr>
                      <td class="style7">
                            </td></tr>
              <tr>
            <td class="style3">
                <asp:GridView ID="ScriptsGridView" runat="server" 
                    HeaderStyle-CssClass="nodrag nodrop" AutoGenerateColumns="False" GridLines="Both"
                    ShowHeader="True" Width="100%" 
                    style="position: relative; top: -40px; left: 275px; height: 2px;" 
                    onrowdatabound="ScriptsGridView_RowDataBound" >
                   
                    <Columns>
                      <asp:TemplateField ItemStyle-CssClass="noselect" HeaderText="ID">  

       <ItemTemplate>  

         <asp:Label ID="lblID" runat="server" Text='<%# Bind("ScriptID") %>'></asp:Label>  

        <asp:HiddenField ID="hdnid" runat="server" Visible="true" Value='<%# Bind("ScriptID") %>' />  

       </ItemTemplate>  

      </asp:TemplateField>  

         <asp:TemplateField ItemStyle-CssClass="noselect" HeaderText="Script Name">  

        <ItemTemplate>  

          <asp:Label ID="lblName" runat="server" Text='<%# Bind("Title") %>'></asp:Label>  

          </ItemTemplate>  

         </asp:TemplateField>  

      <asp:TemplateField HeaderText="Display Order" ItemStyle-CssClass="noselect">  

         <ItemTemplate>  

           <asp:Label ID="lblOrder" runat="server" Text='<%# Bind("DisplayOrder") %>'>  

 </asp:Label>  

           </ItemTemplate>  

         </asp:TemplateField>  

          <asp:TemplateField HeaderText="Text" ItemStyle-CssClass="noselect"   >  
           
         <ItemTemplate>   
         <RowStyle BackColor="#ffffff" />
                    <AlternatingRowStyle BackColor="#ffffff" />

           <asp:Label ID="lbText" runat="server" Text='<%# Bind("Text") %>'>  

 </asp:Label>  

           </ItemTemplate>  

         </asp:TemplateField>  

             
                    </Columns>
                </asp:GridView>
            </td>
        </tr>
    </table>

Open in new window

gridview.doc
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Kaushal AroraTechnical Analyst

Commented:
You can achieve this using the SelectedIndexChanging Event of the gridview. When you will click the Title Column, in the event you will get the RowIndex of the title you clicked and based on that you can fetch the text you want to show and display that on the area defined.

To display the text in area you need to first find the label placed there in the control using FindControl method available.

For reference check out this link for full Gridview events knowledge:

http://www.codeproject.com/Articles/36528/GridView-all-in-one

Hope it helps you.
You can do it from client side also... as there is no communication with server for doing this functionality:

Here is your solution:

http://jsfiddle.net/G7KsM/

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial