Wednesday, 23 April 2014

Client side HTML encoding

12:09    No comments

<!-- Add JS Before build -->
<script src="JS/jquery-1.6.2.min.js" type="text/javascript"></script>

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

    <script type="text/javascript" >

        function validateTxt() {
            var div = document.getElementById("Div1");

            var str = "&lt;h1&gt; Hello.. &lt;/h1&gt;&lt;br /&gt; &lt;b&gt;&lt;i&gt; Chirag Here :) &lt;/i&gt;&lt;/b&gt;";

            str = this.replaceAll(str, "&amp;", "&");
            str = this.replaceAll(str, "&lt;", "<");
            str = this.replaceAll(str, "&gt;", ">");
            str = this.replaceAll(str, "&nbsp;", " ");
            var str4Div = str;
            div.innerHTML = str4Div;
        }

        function replaceAll(str, subStr, newStr) {
            var offset = 0;
            var index = str.indexOf(subStr);
            while (index != -1) {

                 str = str.substr(0, index) + newStr + str.substr(index + subStr.length);
                 offset = index + newStr.length;
                index = str.indexOf(subStr, offset);
            }
            return str;
         }

        $(document).ready(function() {
            validateTxt();
        });

    </script>
</head>

<body>
    <form id="form1" runat="server">
    <div id="Div1" onload="javascript:validateTxt();" >
    </div>
    </form>
</body>
</html>

OutPut::


Demo Download
 
Read More

Friday, 3 January 2014

XML banner fader in jQuery

15:13    No comments
Here’s the XML code.

<!--?xml version="1.0" encoding="utf-8"?-->
<gallery fade="500" ontime="5000">
    <picture src="banners/banner1.jpg" href="http://www.google.com" target="_blank"></picture>
    <picture src="banners/banner2.jpg" href="http://www.yahoo.com" target="_blank"></picture>
    <picture src="banners/banner3.jpg" href="http://www.bing.com" target="_blank"></picture></gallery> 

The HTML code is very simple

<!-- Add JQuery Script -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

<div id="banner"> 
           <a id="banner_href" href="#">
           <img id="banner_image" src="banners/banner1.jpg"  alt="Banner Image" ></a>
 </div> 

 JavaScript.jd Document

$(document).ready(function(){
    xmldata=new Array();         //initialise array for XML data
    fade=0;                                //time taken for transitions
    ontime=0;                           //time between transitions
    changenum=0;                    //current banner
    changetot=0;                      //total banners

    $("#banner").fadeTo(1,0);        //fade out the fallback banner

    $.ajax({                                            //get the XML data
              url: "banners.xml",                //URL to get the data from
              success: function(data) {      //if we succeed, set everything up. We don't expect failure.
                  $(data).find("picture").each(function()
                  {
                    xmldata.push($(this));                //add item into array
                 });
                 changetot=xmldata.length;                                             //get total length
                  ontime=eval($(data).find("gallery").attr("ontime"));    //get fade time
                 fade=eval($(data).find("gallery").attr("fade"));             //get time between fades
                 change_banner(changenum);                                         //change banner for first banner
                 }
        });
});

function change_banner(){
    data=xmldata[changenum];              //get current banner XML object
    img=$(data).attr("src");                    //retrieve variables
    href=$(data).attr("href");
    target=$(data).attr("target");

    $("#banner_href").attr("href",href);        //change variables on HTML
    $("#banner_href").attr("target",target);
    $("#banner_image").attr("src",img);

    //increment banner value, this is executed BEFORE the callback as we already have the variables.
    changenum++;
    if(changenum>=changetot)                //check for banner value bounds
        changenum=0;   

    cache = document.createElement('img');            //create an image
    //pre-cache next image (means the browser will load it instantly)            cache.src = $(xmldata[changenum]).attr("src");
   //fade banner in, then wait, then fade out and call back to this function. 
   $("#banner").fadeTo(fade,1).fadeTo(ontime,1).fadeTo(fade,0,change_banner);    
}
Read More

Thursday, 26 December 2013

Move Selected Gridview Rows to Another Gridview in Asp.net

17:04    No comments
To implement this first we need to write the code in "aspx" page like this::

 <html xmlns="http://www.w3.org/1999/xhtml">
<head><title>Move selected gridview rows to another gridview in Asp.net</title></head>
<body>
<form id="form1" runat="server"><div>
<asp:GridView ID="gvDetails" AutoGenerateColumns="false" CellPadding="5" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" AutoPostBack="true" OnCheckedChanged="chkSelect_CheckChanged" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField HeaderText="UserId" DataField="UserId" />
<asp:BoundField HeaderText="UserName" DataField="UserName" />
<asp:BoundField HeaderText="Education" DataField="Education" />
<asp:BoundField HeaderText="Location" DataField="Location" />
</Columns>
<HeaderStyle BackColor="#df5015" Font-Bold="true" ForeColor="White" />
</asp:GridView>
<br /><b>Second Gridview Data</b>
<asp:GridView ID="gvTranferRows" AutoGenerateColumns="false" CellPadding="5" runat="server" EmptyDataText="No Records Found">
<Columns>
<asp:BoundField HeaderText="UserId" DataField="UserId" />
<asp:BoundField HeaderText="UserName" DataField="UserName" />
<asp:BoundField HeaderText="Education" DataField="Education" />
<asp:BoundField HeaderText="Location" DataField="Location" /></Columns> 
<HeaderStyle BackColor="#df5015" Font-Bold="true" ForeColor="White" /></asp:GridView> 
</div></form>
</body>
</html>

========================================================

C# Code

protected void Page_Load(object sender, EventArgs e)
{ 
if (!IsPostBack)
{
BindGridview();
BindSecondGrid();
}
}
protected void BindGridview()
{
DataTable dt = new DataTable();
dt.Columns.Add("UserId", typeof(Int32));
dt.Columns.Add("UserName", typeof(string));
dt.Columns.Add("Education", typeof(string));
dt.Columns.Add("Location", typeof(string));
DataRow dtrow = dt.NewRow();    // Create New Row
dtrow["UserId"] = 1;   
dtrow["UserName"] = "ChiragPatel";
dtrow["Education"] = "M.sc IT";
dtrow["Location"] = "Kaalol";
dt.Rows.Add(dtrow);
dtrow = dt.NewRow();
dtrow["UserId"] = 2;
dtrow["UserName"] = "ChinkiPandviya";
dtrow["Education"] = "BCA";
dtrow["Location"] = "Vadodara";
dt.Rows.Add(dtrow);
dtrow = dt.NewRow();
dtrow["UserId"] = 3;
dtrow["UserName"] = "KinZy";
dtrow["Education"] = "BCA";
dtrow["Location"] = "Vadodara";
dt.Rows.Add(dtrow);
gvDetails.DataSource = dt;
gvDetails.DataBind();
}
protected void chkSelect_CheckChanged(object sender, EventArgs e)
{
GetSelectedRows();
BindSecondGrid();
}
protected void BindSecondGrid()
{
DataTable dt = (DataTable)ViewState["GetRecords"];
gvTranferRows.DataSource = dt;
gvTranferRows.DataBind();
}
private void GetSelectedRows()
{
DataTable dt;
if (ViewState["GetRecords"] != null)
dt = (DataTable)ViewState["GetRecords"];
else
dt = CreateTable();
for (int i = 0; i < gvDetails.Rows.Count; i++)
{
CheckBox chk = (CheckBox)gvDetails.Rows[i].Cells[0].FindControl("chkSelect");
if (chk.Checked)
{
dt = AddGridRow(gvDetails.Rows[i], dt);
}
else
{
dt = RemoveRow(gvDetails.Rows[i], dt);
}
}
ViewState["GetRecords"] = dt;
}
private DataTable CreateTable()
{
DataTable dt = new DataTable();
dt.Columns.Add("UserId");
dt.Columns.Add("UserName");
dt.Columns.Add("Education");
dt.Columns.Add("Location");
dt.AcceptChanges();
return dt;
}
private DataTable AddGridRow(GridViewRow gvRow, DataTable dt)
{
DataRow[] dr = dt.Select("UserId = '" + gvRow.Cells[1].Text + "'");
if (dr.Length <= 0)
{
dt.Rows.Add();
int rowscount = dt.Rows.Count - 1;
dt.Rows[rowscount]["UserId"] = gvRow.Cells[1].Text;
dt.Rows[rowscount]["UserName"] = gvRow.Cells[2].Text;
dt.Rows[rowscount]["Education"] = gvRow.Cells[3].Text;
dt.Rows[rowscount]["Location"] = gvRow.Cells[4].Text;
dt.AcceptChanges();
}
return dt;
}
private DataTable RemoveRow(GridViewRow gvRow, DataTable dt)
{
DataRow[] dr = dt.Select("UserId = '" + gvRow.Cells[1].Text + "'");
if (dr.Length > 0)
{
dt.Rows.Remove(dr[0]);
dt.AcceptChanges();
}
return dt;
}
====================================================== 

Read More
Subscribe to: Posts (Atom)