Feeds:
Posts
Comments

Archive for the ‘JavaScript’ Category

Recently I come across situation where I need to provide browser based Signature Pad and It should work fine in all the devices including apple devices. So I don’t have any other option left then HTML5 Canvas.

If you want to create a browser based signature pad then visit the link below.

http://thomasjbradley.ca/lab/signature-pad/

To save signed signature visit the link below. (CODE IS IN C#)

http://www.dotnetfunda.com/articles/article1662-saving-html-5-canvas-as-image-on-the-server-using-aspnet.aspx

 

Download Source  [My new blog Address]
Let me know in case of any problem.

Advertisements

Read Full Post »

To run an exe from your web page is quite easy process. I have used simple JavaScript to accomplish this task. Have a look at the code listed below.

function WriteToFile() {

var fso, s,folderName;

fso = new ActiveXObject("Scripting.FileSystemObject");

if (!fso.FolderExists("C:\\HITESH"))

{

folderName=fso.CreateFolder("C:\\ HITESH ");

}

if (!fso.FileExists("C:\\ HITESH \\LaunchApp.bat")){

s = fso.OpenTextFile("C:\\ HITESH \\LaunchApp.bat" , 8, 1, -2);

s.writeline("IF EXIST d:\\hitesh GOTO LABEL1”);

s.writeline("IF EXIST k:\\hitesh GOTO LABEL2”);

s.writeline(":LABEL1”);

s.writeline("D: ”);

s.writeline("D:\\hitesh\\AppTest.EXE”);

s.writeline("EXIT”);

s.writeline(":LABEL2”);

s.writeline("K: ”);

s.writeline("K:\\hitesh\\AppTest.EXE”);

s.writeline("EXIT”);

s.Close();

}

}

function LaunchApp() {

WriteToFile();

var oShell = new ActiveXObject("WScript.Shell");

var prog = "C:\\ HITESH \\LaunchApp.bat";

oShell.run ('"'+prog+'"',1);

}

This javascript will create an object of WScript.Shell and will execute DOS based batch file. In addition with this I have also created LaunchApp.bat file programmatically if it does not exist on the client side (So you don’t need to worry about whether file exist or not J). This file will execute EXE depending upon conditions specified in the LaunchApp.bat. LaunchApp() is the starting point.

Read Full Post »

I search a lot in Google for a whole day but didn’t find any perfect example to populate data into gridview. Then I decided to do it myself and I find it easy at the end of the day.

In the example which I illustrated below follows the flow:

  1. On document ready method it initiates jQuery AJAX call.
  2. Response will be redirected to the ASPX page and in tern server will respond with JSON data.
  3. jQuery AJAX call back success method used to generates HTML Table with data.
  4. Add HTML to DIV.

Here is the code:

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

<head runat="server">

<title>Untitled Page</title>

<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>

<script src="js/commons.js" type="text/javascript"></script>

</head>

<body>

<form id="form1" runat="server">

<div id="divperson">

<strong>[Newly generated HTML will seat here]</strong>

</div>

</form>

</body>

</html>

Default.aspx.cs

public partial class _Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

if (!IsPostBack)

{

if (Request.QueryString["id"] == "person")

GetString();

}

}

public void GetString()

{

JavaScriptSerializer _serializers = new JavaScriptSerializer();

string _personJSON = _serializers.Serialize(Person.GetPersonDetails());

Response.Clear();

Response.Write(_personJSON);

Response.End();

}

}

<strong>//Person Class and Members</strong>

public class Person

{

public string Name { get; set; }

public string State { get; set; }

public string PhoneNumber { get; set; }

public Person(string name, string state, string phone)

{

Name = name;

State = state;

PhoneNumber = phone;

}

public static List<Person> GetPersonDetails()

{

List<Person> _person = new List<Person>();

_person.Add(new Person("Hitesh", "Gujarat", "123"));

_person.Add(new Person("Urvish", "Maharastra", "345"));

_person.Add(new Person("Deepak", "Madhya Pradesh", "456"));

return _person;

}

}

I just created Person class, created some properties and a static method to generate list of Person class objects. You need to include System.Collections.Generic and System.Web.Script.Serialization name space for List Class and JavaScriptSerializer class respectively.

In Page_Load method, based on the querystring value the GetString() method will call and JSON response will be generated and submitted as response. You need to catch this response on client side to retrive values within JSON formatted data.

commons.js (a separate JS file)

$('document').ready(function(){

$.ajax({

type: "GET",

data:({id:"person"}),

url: "Default.aspx",

dataType: "json",

success:function(resultdata){

var person;

var _html='<table border="1">';

_html += '<tr>';

_html += '<th>Name</th>';

_html += '<th>State</th>';

_html += '<th>Phone</th>';

_html += '</tr>';

for(index in resultdata)

{

_html +='<tr>' ;

_html +='<td>' + resultdata[index].Name + '</td>';

_html +='<td>' + resultdata[index].State + '</td>';

_html +='<td>' + resultdata[index].PhoneNumber + '</td>';

_html +='</tr>' ;

}

_html +='</table>' ;

$('#divperson').html(_html);

}

});

});

Nothing fancy, using jquery.ajax method I made a GET request to Default.aspx page with some data. Page has return JSON data which I parsed in jquery.ajax success method.

Before you attempt to run this code in your app, make sure you have included jquery-1.4.2.min.js file.

Read Full Post »

Updatepanel is part of AJAX Extension 1.0 and later provided by Microsoft. Update panel is used to hide page refresh using some standard mechanism. But What about speed? In my experience updatepanel is the best solution if your page does not contain large number of components. And make sure controls you used is supported by updatepanel. Because controls like GridView,Treeview and more , are not supported by updatepanel. So you can expect behaviours change if you put it inside updatepanel.

I have recently trusted on updatepanel and used in my page where speed is the primary concern and that page was almost dead. So avoid using updatepanel where speed is primary requirement.

I have used Prototype AJAX in my application. It’s faster and better. Give it a try.  I tried to use jQuery AJAX but it has not that much support for ASP.net 2.0, its very good if you working on ASP.net 3.0 or ASP.net 3.5 version of .net.

So the conclusion is , avoid using updatepanel to get better speed , insted you can use Prototype or jQuery AJAX to get the best speed and performance of your application.  Googling around the web and you will get many working example of protory and jquery.

Read Full Post »

Most of us use Microsoft AJAX Toolkit and Controls but we don’t know when Ajax Request starts and when it ends. Sometimes we need to do enabling and disabling controls during postback. This can be done using the code below.

var _employee=null;
var _department=null;
var _subdepartment=null;

function pageLoad(sender, args){
// Register start request and end request event handler Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(beginRequest);
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequest); }

// fired when ajax request starts
function beginRequest(sender, args){
_ employee = $get('ctl00_ContentPlaceHolder1_ddlemployee);
_ department = $get('ctl00_ContentPlaceHolder1_ddldepartment);
_ subdepartment = $get('ctl00_ContentPlaceHolder1_ddlsubdepartment);
_ employee.disabled=true;
_ department.disabled=true;
_ subdepartment.disabled=true; }

// fired when ajax request ends
function endRequest(sender, args) {
_ employee.disabled=false;
_ department.disabled=false;
_ subdepartment.disabled=false;
}

Here I have added two event handlers to request manager class instance. Event will be fired when request starts or ends. Isn’t it easy? 🙂

Ref : http://mattberseth.com/blog/

Read Full Post »

This is common JavaScript error occurred while working with asp.net. I have faced this problem numerous times and believe me this is really very cumbersome error. This error occurs because of badly written JavaScript or due to access permission to the particular file, folder or image(s). Sometimes in your code if you have written path which does not exist in your .net web application. This kind error may occur. Friends, I have got this error many times and trust me each and every time its tuff to find where the problem is. Even my colleagues got this kind error many times. I have searched a lot about this error on Internet but not able to find the exact solution. Everybody is saying that it’s because of unclosed quotation mark in JavaScript. It’s true but not in every case.
 
In addition, what happens sometime you may not get this error while you work locally and the time when you deploy it to web-server you will get ‘unterminated string constant’ error. Am I correct ?
 
Here are the checklists/suggestions to resolve this error.
  1. Check you javascript for unclosed quotation mark. Check inline as well as reference JavaScript file. Starts with inline JavaScript.
  2.  

  3. Give proper permission (rights) to directory under which your aspx page laying. Ex. Rights for IIS user, ASP.net process.
  4.  

  5. Also check permission (rights) for image directory, if you are working with images.
  6.  

  7. Check for the hard coded path in the CS(Class file in C#) ,if any, check existence for the path.
  8.  

     

     

I hope the solutions above might be useful to resolve unterminated string constants error.

Read Full Post »