We Keep Coding

Asp.net Using Load More instead of Datapage in ListView Control

I need to understand how can I use Load More Option to the Listview. Initially I am loading 30 rows from Database. Here Instead of datapager I want Load More Button on which click I wan to add 30 more rows everytime when user clicks. Can you help me with what logic need to be apply here? My Listview structure like below
<asp:ListView ID="products" runat="server">
<TtemTemplate>
<div>
My Content
</div>
<ItemTemplate>
</asp:ListView>
<asp:Button ID="btnLoadMore" runat="server" Text="Load More"></asp:Button>

Here is a quick example of how you can achieve this. The easiest way is to use Linq to get the correct items from a List of objects. For this snippet it is just a List of integers. I uses ViewState to store the page number, but this can also be Session, Cookie etc.
protected void Page_Load(object sender, EventArgs e)
{
if (IsPostBack == false)
{
//bind the initial items to the listview
products.DataSource = getData(0);
products.DataBind();
//store the current page number in a viewstate
ViewState["currentPage"] = 0;
}
}
public List<int> getData(int pageIndex)
{
//the numver of items on a page
int itemsPerPage = 30;
//create a new list
List<int> list = new List<int>();
//add some dummy data
for (int i = 0; i < 100; i++)
{
list.Add(i);
}
//return the list with the correct number of items and offset
return list.Skip(pageIndex * itemsPerPage).Take(itemsPerPage).ToList();
}
protected void btnLoadMore_Click(object sender, EventArgs e)
{
int currentPage = 0;
//always check if the viewstate exists
if (ViewState["currentPage"] != null)
{
//convert the viewstate back to an int and increment
currentPage = Convert.ToInt32(ViewState["currentPage"]) + 1;
}
//bind the new items to the listview
products.DataSource = getData(currentPage);
products.DataBind();
//update the page number in a viewstate
ViewState["currentPage"] = currentPage;
}
The aspx to make the snippet complete.
<asp:ListView ID="products" runat="server">
<ItemTemplate>
<%# Container.DataItem %><br />
</ItemTemplate>
</asp:ListView>
<asp:Button ID="btnLoadMore" OnClick="btnLoadMore_Click" runat="server" Text="Load More"></asp:Button>

reset / clear all text box function not working

I have a function that is supposed to clear/reset all textbox in my aspx.page and this page is using a master page but it doesn't work. below is the code. Just got this code from this site.
//Clear all textbox
ResetTextBoxes(this);
//function to clear textboxes
private void ResetTextBoxes(Control parent)
{
if (parent is TextBox)
{
((TextBox)parent).Text = string.Empty;
}
foreach (Control child in parent.Controls)
{
if (child is TextBox)
{
((TextBox)child).Text = string.Empty;
}
ResetTextBoxes(child);
}
}

Just want to share a solution on asp.net codebehind. In this , you should put all the id's of your textboxes in array.
TextBox[] textboxes = {TextBox2,TextBox3,TextBox4,TextBox5,TextBox6 };
for (int i = 0; i < 5; i++)
{
TextBox myTextBox = textboxes[i];
myTextBox.Text = "";
}

The other way around I found is use a javascript function that will clear all my asp.net Textboxes. I've added a class to all all the Textbox e.g.
<asp:TextBox ID="txtName" runat="server" class="mTxtBox"> </asp:TextBox>
<asp:TextBox ID="txtID" runat="server" class="mTxtBox"> </asp:TextBox>
<asp:TextBox ID="txtDept" runat="server" class="mTxtBox"> </asp:TextBox>
<asp:Button onclick="ClearTxtBoxes_Click" ID="ClearTxtBoxes" runat="server" Text="Clear Fields"> </asp:Button>
//onclick event of Button
ScriptManager.RegisterStartupScript(this,this.GetType(),"runJs","clearText();",true);
//my JavaScriptFunction
function clearText(){
$('.mTxtBox').val('');
}

Controls sometimes have a hard time updating. Try calling child.Refresh(); and see if that fixes it.

Using dropdown names as variable in asp.net

I wants to use dropdown names as variable in asp.net webpage.
We have 10 dropdownlist with id- ddl1,ddl2,....ddl10.
What my requirement is that i need to show and hide from the code behind file
<div id ="divContainer" class="field" runat="server">
<asp:Label ID="lblmsg1" runat="server" Text="" CssClass="fieldtxt">
<asp:DropDownList ID="DropDownList1" runat="server" CssClass="fieldtxtbox1" OnSelectedIndexChanged="ddlCommand_SelectedIndexChanged">
</asp:DropDownList>
<asp:DropDownList ID="DropDownList2" runat="server" CssClass="fieldtxtbox1" OnSelectedIndexChanged="ddlCommand_SelectedIndexChanged">
</asp:DropDownList>
<asp:DropDownList ID="DropDownList3" runat="server" CssClass="fieldtxtbox1" OnSelectedIndexChanged="ddlCommand_SelectedIndexChanged">
</asp:DropDownList>
<asp:DropDownList ID="DropDownList4" runat="server" CssClass="fieldtxtbox1" OnSelectedIndexChanged="ddlCommand_SelectedIndexChanged">
</asp:DropDownList>
//like this 10 different DropDownList
</div>
i have certain loop for doing that.
i need something like this...
ddl[i].Visible = true;
when i tried this got error like
'System.Web.UI.WebControls.DropDownList' is a 'type' but is used like a 'variable'
Please help

This should do the trick
DropDownList ddls = null;
for (int i = 1; i <= 10; i++) {
ddls = (DropDownList)this.FindControl("DropDownList" + i);
if (ddls != null) {
ddls.Visible = true;
}
}
The controls should be immediate children of the page. If these are embedded in other server control such as FormView, GridView etc or on Master page, then you must use that control or master in conjunction with FindControl

Why not using javascript?
//save the div in a var
//check the name of the div in the generated html, it might be different from the name you have in asp.net
var divContainer = document.getElementById("divContainer");
//get all ddl contsols by Tag (tag for ddl is select)
var ddls = divContainer.GetElementByTag("select");
//iterate through the found select controls from the div and set them to visible
for (var i = 0, len = ddls.length; i < len; ++i)
{
ddls[i].style.display='block';
}

Dynamically Created Controls losing data after postback

Actually, I am Creating 1 TextBox on Pageload and adding that TextBox to Panel.
Now, I have a LinkButton like Add Another.
I am entering Text in that TextBox and if needed I need to Create New TextBox,by clicking Add Another LinkButton.
Actually, I am able to get the count and recreate the TextBoxes.
But,the Problem is that, My Entered text in the Previously Generated Textboxes is Missing.
Can Anyone,Suggest me a solution for this?
protected void Page_Load(object sender, EventArgs e)
{
try
{
if (!IsPostBack)
{
for (int i = 0; i < 5; i++)
{
TableRow row = new TableRow();
for (int j = 0; j < 5; j++)
{
TableCell cell = new TableCell();
TextBox tb = new TextBox();
tb.ID = "TextBoxRow_" + i + "Col_" + j;
cell.Controls.Add(tb);
row.Cells.Add(cell);
}
Table1.Rows.Add(row);
}
}
}
catch (Exception ex)
{
throw;
}
}
This is a Sample Code, the same code is written in Button_Click Also
protected void ASPxButton1_Click(object sender, EventArgs e)
{
int k = Table1.Controls.Count;
}
I am getting a Count=0 on Button_Click.

All you need to do is to re-instantiate / reinitialize dynamic controls before or within page load event each and every time during postback and add this control to page / forms / placeholders. Then, the posted data will automatically be assigned to the control by calling the LoadPostData method by the parent control.
check the article and how to write code for dynamic control -
How to maintain dynamic control events, data during postback in asp.net

When using dynamic controls, you must remember that they will exist only until the next postback.ASP.NET will not re-create a dynamically added control. If you need to re-create a control multiple times, you should perform the control creation in the PageLoad event handler ( As currently you are just creating only for first time the TextBox using Condition: !IsPostabck ). This has the additional benefit of allowing you to use view state with your dynamic control. Even though view state is normally restored before the Page.Load event, if you create a control in the handler for the PageLoad event, ASP.NET will apply any view state information that it has after the PageLoad event handler ends.
So, Remove the Condition: !IsPostback, So that each time the page Loads, The TextBox control is also created. You will also see the State of Text box saved after PageLoad handler completes. [ Obviously you have not disabled ViewState!!! ]
Example:
protected void Page_Load(object sender, EventArgs e)
{
TextBox txtBox = new TextBox();
// Assign some text and an ID so you can retrieve it later.
txtBox.ID = "newButton";
PlaceHolder1.Controls.Add(txtBox);
}
Now after running it, type anything in text box and see what happens when you click any button that causes postback. The Text Box still has maintained its State!!!

The dynamically generated control do not maintain state. You have to maintain it at your own. You can use some hidden field to keep the state of controls, which will be used on server side to extract the state. Asp.net uses hidden field to maintain the state between requests, you can see __VIEWSTATE in the source.
In ASP.NET pages, the view state represents the state of the page when
it was last processed on the server. It's used to build a call context
and retain values across two successive requests for the same page. By
default, the state is persisted on the client using a hidden field
added to the page and is restored on the server before the page
request is processed. The view state travels back and forth with the
page itself, but does not represent or contain any information that's
relevant to client-side page display, Reference.

Just remove this line
if (!IsPostBack)

This is My final answer after working a lot with Dynamic Controls
.aspx
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div style="text-align: center">
<div style="background-color: Aqua; width: 250px;">
<br />
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:PlaceHolder runat="server" ID="myPlaceHolder"></asp:PlaceHolder>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnAddTextBox" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<br />
</div>
<br />
<asp:Button ID="btnAddTextBox" runat="server" Text="Add TextBox" OnClick="btnAddTextBox_Click" />
<br /><br />
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Button runat="server" ID="MyButton" Text="Get Values." OnClick="MyButton_Click" />
<br /><br />
<asp:Label runat="server" ID="MyLabel"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
.aspx.cs
static int myCount = 0;
private TextBox[] dynamicTextBoxes;
protected void Page_PreInit(object sender, EventArgs e)
{
Control myControl = GetPostBackControl(this.Page);
if ((myControl != null))
{
if ((myControl.ClientID.ToString() == "btnAddTextBox"))
{
myCount = myCount + 1;
}
}
}
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
dynamicTextBoxes = new TextBox[myCount];
int i;
for (i = 0; i < myCount; i += 1)
{
TextBox textBox = new TextBox();
textBox.ID = "myTextBox" + i.ToString();
myPlaceHolder.Controls.Add(textBox);
dynamicTextBoxes[i] = textBox;
LiteralControl literalBreak = new LiteralControl("<br />");
myPlaceHolder.Controls.Add(literalBreak);
}
}
protected void btnAddTextBox_Click(object sender, EventArgs e)
{
// Handled in preInit due to event sequencing.
}
protected void MyButton_Click(object sender, EventArgs e)
{
MyLabel.Text = "";
foreach (TextBox tb in dynamicTextBoxes)
{
MyLabel.Text += tb.Text + " :: ";
}
}
public static Control GetPostBackControl(Page thePage)
{
Control myControl = null;
string ctrlName = thePage.Request.Params.Get("__EVENTTARGET");
if (((ctrlName != null) & (ctrlName != string.Empty)))
{
myControl = thePage.FindControl(ctrlName);
}
else
{
foreach (string Item in thePage.Request.Form)
{
Control c = thePage.FindControl(Item);
if (((c) is System.Web.UI.WebControls.Button))
{
myControl = c;
}
}
}
return myControl;
}

When you are working with dynamic controls they will not able to maintain its state during postback and their data lost Cause they dont have any viewstate to maintain their data.
You only need to maintain the created controls data into ViewState
dynamically and loads the data into page at the time of postback and you
done.
public Dictionary<Guid, string> UcList
{
get { return ViewState["MyUcIds"] != null ? (Dictionary<Guid, string>)ViewState["MyUcIds"] : new Dictionary<Guid, string>(); }
set { ViewState["MyUcIds"] = value; }
}
public void InitializeUC()
{
int index = 1;
foreach (var item in UcList)
{
var myUc = (UserControls_uc_MyUserControl)LoadControl("~/UserControls/uc_MyUserControl.ascx");
myUc.ID = item.Value;
pnlMyUC.Controls.AddAt(index, myUc);
index++;
}
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
LoadControl();
else
InitializeUC();
}

Actually, I have used Javascript for accomplishing my task.
and it goes like this :
<form id="form1" runat="server" enctype="multipart/form-data" method="post">
<span style="font-family: Arial">Click to add files</span>
<input id="Button1" type="button" value="add" onclick="AddFileUpload()" />
<br />
<br />
<div id="FileUploadContainer">
<!--FileUpload Controls will be added here -->
</div>
<asp:HiddenField ID="HdFirst1" runat="server" Value="" />
<br />
<asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="btnUpload_Click" />
</form>
Script :
<script type="text/javascript">
var counter = 0;
function AddFileUpload() {
var div = document.createElement('DIV');
div.innerHTML = '<input id="file' + counter + '"name = "file' + counter + '"type="text"/><input id="file' + counter + '" name = "file' + counter + '" type="file" /><input id="Button' + counter + '" type="button" value="Remove" onclick = "RemoveFileUpload(this)" />';
document.getElementById("FileUploadContainer").appendChild(div);
counter++;
}
function RemoveFileUpload(div) {
document.getElementById("FileUploadContainer").removeChild(div.parentNode);
}
function mydetails(div) {
var info;
for (var i = 0; i < counter; i++) {
var dd = document.getElementById('file' + i).value;
info = info + "~" + dd;
}
document.getElementById('<%= HdFirst1.ClientID %>').value = info;
}
</script>
and In the Upload_Click Button :
for (int i = 0; i < Request.Files.Count; i++)
{
string strname = HdFirst1.Value;
string[] txtval = strname.Split('~');
HttpPostedFile PostedFile = Request.Files[i];
if (PostedFile.ContentLength > 0)
{
string FileName = System.IO.Path.GetFileName(PostedFile.FileName);
// string textname=
//PostedFile.SaveAs(Server.MapPath("Files\\") + FileName);
}
}

how to count number of checkboxes(across all pages of gridview) checked in gridview using javascript

I am in a situation where in need help from you.
i have written below code in javascript which checks how many checkboxes are checked in gridview and display message however its restricted to one page of my gridview only and doesnt work when i move to next page, is there any way that javascript code check how many checkboxes have been checked across all pages of gridview ?
function CheckBoxCount()
{
var gv = document.getElementById("<%= Gridview1.ClientID %>");
var inputList = gv.getElementsByTagName("input");
var numChecked = 0;
for (var i = 0; i < inputList.length; i++)
{
if (inputList[i].type == "checkbox" && inputList[i].checked)
{
numChecked = numChecked + 1;
if( numChecked > 8)
{
alert('Only Eight items could be added in final grid');
break;
}
}
}
}

alert($('input[name=checkbox_name]').attr('checked'));
or
alert($("input:checkbox:checked").length);
if they didnt work check this : calculate the number of html checkbox checked using jquery
*** dont forget to add Jquery.min.js in your markup

Try the bellow code:
Javascript:
function gvCheckBoxClick(currentCheck) {
var input = document.getElementById("<%=gvRuleList.ClientID %>");
var chekRowCount = document.getElementById("<%=chkRowCount.ClientID %>").value;
if (currentCheck.type == "checkbox") {
if (currentCheck.checked == true) {
chekRowCount++;
}
else {
chekRowCount--;
}
}
}
Gridview:
<Columns>
<asp:TemplateField HeaderText="<%$ Resources:Opm_RuleList_ListHeader_Select %>">
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" onclick="javascript:gvCheckBoxClick(this);"/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
use hidden variable
<input type="hidden" id="chkRowCount" name="chkRowCount" runat ="server" value="0" />