Showing posts with label JavaScript. Show all posts
Showing posts with label JavaScript. Show all posts

Monday, February 11, 2008

_getCursorIndex for FireFox and Internet Explorer

_getCursorIndex for FireFox and Internet Explorer

getCursorIndex function works for FireFox. Hope this works for Internet Explorer also

_getCursorIndex: function() {
return this.get_element().selectionStart;
},


getCursorIndex function works for Internet Explorer

_getCursorIndex: function() {
return o.value.lastIndexOf("Your String")
},

Monday, December 11, 2006

get the dimension of my document using JavaScript

to get the dimension of my document.

// javascript
var screen_width = null;
var screen_width = null;
screen_width = document.body.offsetWidth;
alert('Get IT');
screen_height = document.body.offsetHeight;
document.forms[0].txt_width.value = screen_width;
document.forms[0].txt_height.value = screen_height;

But the above script will fire only once the first time when the page is loaded.

do to execute this script every time the user resize window of the browser, use the following code part

if (self.innerWidth)
{
frameWidth = self.innerWidth;
frameHeight = self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth)
{
frameWidth = document.documentElement.clientWidth;
frameHeight = document.documentElement.clientHeight;
}
else if (document.body)
{
frameWidth = document.body.clientWidth;
frameHeight = document.body.clientHeight;
}
else return;
if (self.screen.width < frameWidth *2 self.screen.height < frameHeight *2)
{
newWidth = self.screen.width/2;
newHeight = self.screen.height/2;
if (document.layers)
{
tmp1 = parent.outerWidth - parent.innerWidth;
tmp2 = parent.outerHeight - parent.innerHeight;
newWidth -= tmp1;
newHeight -= tmp2;
}
parent.window.resizeTo(newWidth,newHeight);
parent.window.moveTo(self.screen.width/4,self.screen.height/4);
}
else
{
alert('No resize necessary');
}

Sunday, November 12, 2006

Show/Hide a row in ASP.NET DataGrid

In this article i'm goin to explain you how to show or hide a certain row in the ASP.NET datagrid using JavaScript. First populate your datagrid with some records. Here in this example i have populated my datagrid with one sample XML file.

Sample XML document structure:

<movies>

<movie movieid="1000">

<moviename>Dr.No</moviename>
<artist>James Bond</artist>
<year>1970</year>
<language>English</language> <image>anne_hathaway90x80.jpg</image>
</movie>
<movie movieid="1001">
<moviename>Raja</moviename>
<artist>Raja</artist>
<year>1990</year>
<language>Hindi</language> <image>dogsfri90x80.jpg</image>
</movie>
</movies>

After populating the grid, my grid shows like this...



The following code part is used for populating my datagrid in my ASP.NET page. autoGenerateColumns is set to False in order to manipulate the columns manually.

string SampleDataToPopulate = Server.MapPath("sampledatafile.xml");
DataSet dataSet = new DataSet();
dataSet.ReadXml(SampleDataToPopulate);
dgShowHide.DataSource = dataSet;
dgShowHide.DataBind();

and with DataBinder.Eval in the ItemTemplate of the datagrid, i'm populating my data.


JavaScript to do Show/Hide in ASP.NET Datagrid:

The javascript function loops through the arguments and sets up an element object to change the visibility to hidden or visible for the datagrid table row.

JavaScript Fuction:

function chgTextDetails(link)
{
link += "link";
linkText = document.getElementById(link);
linkText.firstChild.nodeValue;
if (linkText.firstChild.nodeValue == "Hide")
{
linkText.firstChild.nodeValue = "Show";
}
else
{
linkText.firstChild.nodeValue = "Hide";
}
}

After implementing all these part of code and we will get the complete solution for show hide operation in the ASP.NET Datagrid. After implementing the grid looks like. The screen clips as follows.


Here is the completed and running solution is aatached. Download The SourceCode

ASP.NET MVC - Sport Facility Booking system

  The project relies on some external service providers. Thus accessing them via their API requires authentication. An API Key need to be su...