Add this to your html page :
<!doctype html>
<!-- saved from url=(0023)http://www.contoso.com/ -->
<!doctype html>
<!-- saved from url=(0023)http://www.contoso.com/ -->
In this example I am creating 2 buttons dynamically on page load through JQuery & We can scroll left & right on click on these 2 buttons
$(document).ready(function () {
// Creating two Left Right Scroll Button through JQuery
var btnRht= $("<input type='button' id='btnLeft' value='>>' class='ButtonStyle' width='5px' />");
var btnLeft = $("<input type='button' id='btnRight' value='<<' class='ButtonStyle' />");
// appending buttons to a td inside a html div
$('#tdDoE').append(btnLeft);
$('#tdDoE').append(btnRht);
// Left / Rht Scroll scroll
$("#btnLeft").click(function () {
var leftPos = $('.DivDataMain').scrollLeft();
$(".DivDataMain").animate({scrollLeft: leftPos + 250}, 600);
});
$("#btnRight").click(function () {
var leftPos2 = $('.DivDataMain').scrollLeft();
$(".DivDataMain").animate({scrollLeft: leftPos2 - 250}, 600);
});
});
HTML Code :-
<div style="width: 300px; overflow: hidden;" class="DivDataMain">
<table>
<tr>
<td id="tdDoE">
Scroll Buttons will be appended after this text.
</td>
</tr>
</table>
</div>
window.onload = function () {
getChkItem();
}
function getChkItem() {
var chk = "";
var arrChk = new Array('cbID_1','cb_2',cb_3,cb_4,cb_6); // checkbox 1 ID & check 2
for(iCtr=0; iCtr < arrChk.length; iCtr++){
var element = document.getElementById(arrChkRht[iCtrRht]);
if (typeof(element) != 'undefined' && element != null) { if(document.getElementById(arrChk[iCtr]).checked){
chk = chk + arrChk[iCtr].split("_")[1] + "," ;
}
}
alert(chk.slice(0, -1)); }
<script type="text/javascript">function noError(){return true;}window.onerror = noError;</script><asp:DataGrid ID="grdList" DataKeyField="diagnosis_id" Runat="server" AutoGenerateColumns="False"
AllowPaging="False" PageSize="100" ShowHeader="true" >
<Columns>
<asp:BoundColumn DataField="diagnosis_name" HeaderText="DIAGNOSIS" SortExpression="diagnosis_name asc">
<HeaderStyle Width="75%" HorizontalAlign="Center" ></HeaderStyle>
<ItemStyle CssClass="greylabelsmall"></ItemStyle>
</asp:BoundColumn>
</asp:TemplateColumn>
</Columns>
</asp:DataGrid>
Private Sub GetCheckedBox()
For Each item As DataGridItem In grdICDList.Items
If CType(item.FindControl("chkICD"), CheckBox).Checked Then
icdIds = icdIds + Convert.ToString( grdList .DataKeys.Item(item.ItemIndex)) + ","
End If
Next
If icdIds.Length > 0 Then
If icdIds.LastIndexOf(",") > 0 Then
icdIds = icdIds.Substring(0, icdIds.Length - 1)
End If
'SaveICDs()
InsertDiagnosis(icdIds)
End If
End Sub
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="id" DataSourceID="SqlDataSource1"> <Columns> <asp:TemplateField> <ItemTemplate> <asp:Image ID="img12" runat="server" Width="600px" Height="400" ImageUrl='<%# Page.ResolveUrl(string.Format("~/ClientImages/{0}", Eval("image"))) %>' /> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> ## SqlDataSource ## <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:XXXXConnectionStringName %>" SelectCommand="Stored_Procedure_Name" SelectCommandType="StoredProcedure"> </asp:SqlDataSource>