Archive | JQUERY RSS feed for this section

Avoid iframe scrolling issue Using Jquery

15 Nov

In my asp.net web application am using iframe. But i faced some scrolling issues. ie, some of my pages are large in size, then there will be scroll bars for browsers and iframe. Am stuck in this issues for long time. At last i find out a solution using jquery. I fix browser’s scrolling off and set height and width of iframe related to browsers height and width, and then set scroll bars for iframe. Here I am success with the following jquery,

var newheight = $(document.body).height();

var newH = parseInt(newheight) – 90;

var newHI = parseInt(newheight) – 130;

var width = $(document.body).width();

var newwidth = $(‘#LeftPane‘).height(newH).width();

var newW = parseInt(width) – (parseInt(newwidth) + 30);

$(“#ifrforms).height(newHI).width(newW);

Here LeftPane is div in my page where all menus resides. I just wants to set scroll bar for that too based on browser’s height and width.

JQUERY- Introduction

5 Oct

JQuery is a lightweight, fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for

rapid web development. JQuery is designed to change the way that you write JavaScript.Query is a library of JavaScript Functions.

The jQuery library contains the following features:

* HTML element selections
* HTML element manipulation
* CSS manipulation
* HTML event functions
* JavaScript Effects and animations
* HTML DOM traversal and modification
* AJAX
* Utilities

JQuery Syntax:

The jQuery syntax is tailor made for selecting HTML elements and perform some action on the element(s).

Basic syntax is: $(selector).action()

* A dollar sign to define jQuery
* A (selector) to “query (or find)” HTML elements
* A jQuery action() to be performed on the element(s)

JQuery selectors allow you to select and manipulate HTML elements as a group or as a single element.

JQUERY TAB SWITCHING ACCORDING TO QUERY STRING VALUE

28 Sep

As we all know about jquery tabs and tab switching.Here i would like to share the code for  jquery tab switching according to some query string values. 

 

Let “tabid” be the query string . The function getQuerystring() is used to get the value of the query string “tabid”.According to that value we can switch the jquery tabs using

$(‘#tabs’).tabs(‘select‘, inx)  Where inx is the query string value

The code is :

<script type=”text/javascript“>
$(document).ready(function() {
var inx = getQuerystring(“tabid“);
if (isNaN(inx))
inx = 2;
$(‘#tabs‘).tabs();
$(‘#tabs’).tabs(‘select‘, inx); 

});

function getQuerystring(key, default_) {
if (default_ == null) default_ = “”;
key = key.replace(/[\[]/, “\\\[“).replace(/[\]]/, “\\\]”);
var regex = new RegExp(“[\\?&]” + key + “=([^&#]*)”);
var qs = regex.exec(window.location.href);
if (qs == null)
return default_;
else
return qs[1];
}
</script>

Dynamically adding table row using JQuery

30 Aug

Here is the code for adding rows dynamically  into a HTML table using JQuery. If you want to insert rows to a HTML table in your asp page this is helpful. Using the following code you can insert  a new row at client side without postbacking.

$(‘ tblDoc tr:last’).after(

“<tr>”+“<td  style=’width:150px;’><span>” + getTextBoxValue(‘<%=txtDocName.ClientID %>’) + “</span></td><td  style=’width: 150px’>” + getTextBoxValue(<%=txtDocNo.ClientID %>’) + “</td><td  style=’width: 150px’>” + getTextBoxValue(‘<%=txtIssuedBy.ClientID %>) + “</td><td  style=’width: 150px’>” + getTextBoxValue(‘<%=txtIssuedDate.ClientID %>’) + “</td><td  style=’width: 150px’>” + getTextBoxValue(‘<%=txtRenewalDate.ClientID %>’) + “</td></tr>”

);

tblDOC– Name of the table

Values are inserted at last row.