.NET and BEYOND: javascript

Showing posts with label javascript. Show all posts

Tuesday, April 21, 2015

Defining and using Server variables in the html head section of page

My browser was caching the javasscripts and css and it gets annoying when you are multiple design changes to code. So I decided to do cache busting. I defined a Random number variable in code behind and wanted to use it in html <head> so that every time a request is made, the browser takes it as a new request to the server with a fresh copy of styles and javascript files. The solution is a little quirky, but works:

<link href="mystyle.css?rn=<%="" +Rand %>" type="text/css" rel="stylesheet"/>

where:

rn : is variable for Random Number

Rand : is server side generated Random number

Considering the Random number generated as 1234, the output would be like below:

Note: Use this for development only. Caching is always good to have in production to speed up loading times. With any new build of css/javascript, a version number can be assigned to get a fresh copy.

Wednesday, August 7, 2013

Using Jquery and JQuery UI inside AJAX UpdatePanel

I wanted to call a JQuery "alert" on the Click event of a button, which was also a Trigger to an Update Panel. My condition for the alert was in code behind. For those who experienced this, JQuery/javascript doesn't work nicely with UpdatePanel

Searching on Google led me to the solution below and it works as expected!

protected void btnPrevious_Click(object sender, ImageClickEventArgs e){

int curpageindex=-1;

if ((int)ViewState["Pageindex"] > 0)

{

//Your code

BindData();

}

else if ((int)ViewState["Pageindex"] == 0)

ScriptManager.RegisterStartupScript([updatePanelId], this.GetType(), "click", "firstrecord();", true); }

Please bear in mind that ScriptManager is the Ajax ScriptManager that has different overloading Parameters, one of them being a reference to the UpdatePanel.

Here's a nice explaination of how this works.

Wednesday, May 8, 2013

Passing down a string with an apostrophe to javascript function

Its like back to Javascript 101, but sometimes its forgotton and takes up some time to identify whats wrong with the script. Thats what happened to me. I wasn't sure how would I parse my string. Finally got an answer.

 Edit Content

The escape character takes care of the apostrophe, and the HtmlDecode takes care of any browser based compatibility issues

Tuesday, February 1, 2011

First dive into jQuery

Alright so learning new stuff never ends, and it is always exiting to learn cool animation stuff using AJAX. Well, this time around its jQuery.

What I wanted was an animation to pop up a "content box" at a specific scroll position. And jQuery did this thing very well.

Ok for beginners like me, this is where you can get all the documentation for learning jQuery:

http://jquery.com/

Easy enough.

I am using version 1.4.4 but you can download the latest version (v 1.5) from the website. There are various CDNs that you can point to if you dont like to have a local copy.

Google CDN

Microsoft CDN

Now here's the thing. I am using the $(window).scroll event which triggers when the scroll position is changed. You can have this event on a window or any element with style applied as "overflow:scroll" or "overflow:auto" where the height of the element is less than its content.

The code goes here:

It comes out to be that browsers with webkits(Chrome, safari) have a different behavior with scrollTop, so please keep in mind that you make it compatible with all browsers.

Way to go jQuery. Hope to do a lot of good stuff with you in the future

Tuesday, June 2, 2009

Firefox and Mouseout Issue

Today I had an a very minor issue, but it was worth writing here. Firefox had this nasty delay of triggering from the mouseover even to mouseout event on my menu which had a javascript to be executed in order to change the text inside a span tag. Having done this tons of times before, I cannot recall this issue. However, this might be due to the fact that the anchor tag encompassing the span tag of the menu had a background image applied and this might be the cause of conflict or delay on the triggering of the mouseout event of the span tag. This issue was not displayed in IE, Opera or Safari, though.

I tried using innerHTML to change the text, but of no avail. After a couple of quick searches, I found out using the

obj.firstChild.data

element, where obj is your span tag. It worked perfect miraculously! This brings to the conclusion that the old school DOM model is still worthwhile!