Showing posts with label Java script. Show all posts
Showing posts with label Java script. Show all posts

Monday, December 17, 2012

Java Script Dropdownlist validation in asp.net

In previous post i have given Dropdownlist validation using jquery.In this post i will show how to perform validation on drop down list using java script in asp.net.Here we have to check whether the select index value of dropdown list is zero or not.Based on that we can do validation on it .
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DropdownValidation.aspx.cs" Inherits="DropdownValidation" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Dropdown Validation using Jquery</title>
<script language="javascript" type="text/javascript">
function cityValidate() {
var ddlcity = document.getElementById("<%=ddlCity.ClientID %>");
if (ddlcity.selectedIndex <= 0) {
alert('please choose city');
return false;
}
else
return true;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table><tr><td>First Name:</td><td> <asp:TextBox ID="txtname" runat="server"></asp:TextBox></td></tr>
<tr><td>Last Name:</td><td><asp:TextBox ID="txtlastname" runat="server"></asp:TextBox></td></tr>
<tr><td>Phone:</td><td>  <asp:TextBox ID="txtaddr" runat="server"></asp:TextBox></td></tr>
<tr><td>City</td><td><asp:DropDownList ID="ddlCity" runat="server">
<asp:ListItem Text="Please Select" Value=""></asp:ListItem>
<asp:ListItem Text="Hyderabad" Value="a"></asp:ListItem>
<asp:ListItem Text="Delhi" Value="b"></asp:ListItem>
<asp:ListItem Text="Bombay" Value="c"></asp:ListItem>
<asp:ListItem Text="Chennai" Value="c"></asp:ListItem>
</asp:DropDownList></td></tr></table>
<asp:Button ID="btnvalidate" runat="server" text="submit"  OnClientClick="return cityValidate()"/>
</form>
</body>
</html>
Basic Form
Alert for Dropdown validation
Recently i have seen a question regarding dropdown lists.i:e which is correct in drop down or drop-down?. Every one would provide the answer with comment on this post

Thursday, December 6, 2012

How to remove or cancel onsubmit event in java script

This kind of situation we may get when we work with javascript methods.In my application the dynamic java script onsubmit event has been used to form for validation .Based on requirement i need to add the onclick event on submit button in form.So the problem here is ,when i click on the button the form onsubmit event also fired.Because of that i can't insert the valid data in to data base.
To resolve this i just do the onsubmit function return false.then then will stop that event when i click on button.
function validatecheck()
{
var rad=document.getElementById('OR');
if(radi.checked)
{
var vali=document.getElementById('OT').value;
if(val=="")
{
alert('Please enter value');
document.getElementById('frmres').onsubmit = function() {
return false;
}
}
else
{
document.getElementById('frmres').onsubmit = function() {
return dynamicvalidation();
}
}
}
}

Tuesday, December 4, 2012

Validate textbox based on radio button selection in java script

In this post i will show a simple validation on text box using java script base on radio box selection.Here i have radio button groups which has four radio button.Then the requirement here is ,when we checked the other radio button we should enter the data in to text box.To resolve this just given Id's to both controls and access to through the script.
HTML:
<div>
<table>
<tr>
<td><input type="radio" name="Amt_Num" value="1000"/></td><td>$2,000</td>
</tr>
<tr>
<td><input type="radio" name="Amt_Num" value="500"/></td><td>$300  </td>
</tr>
<tr>
<td><input type="radio" name="Amt_Num" value="450"  /></td><td>$250  </td>
</tr>
<tr>
<td><input type="radio" id="OtherR" name="Amt_Num" value="Other" />
</td><td>Other:</td><td><input type="text" id="OtherT"  name="AmtOther_Num" size="6"/></td>
</tr>
</table>
<input type="submit" id="btnsubmit" value="GetData" onclick="validatetext()"/>
</div>
 
JavaScript:

function validatetext() {
var v = document.getElementById('OtherR');
if (v.checked) {
var t = document.getElementById('OtherT').value;
if (t =="") {
alert('Please enter value in Other');
document.getElementById('OtherT').focus();
} 
}
}
In the above script ,just check the text box data is empty or not.If the text box is empty ,we will display an alert for confirmation.

Monday, December 3, 2012

How to get the data using onclick Event in java script ||Java script onclick event

In this post i would like give an example on Javascript onclick event and How to get the data of text box using java script.In the below one i will write down a onclick event for button ,then get the text box data in it.Here we can a method GetValue which has been using to get the data of input control.
<input type="text" id="txtname"/>
<input type="submit" onclick="GetValue()" value="GetData"/>

//Java script
<script type="text/javascript">
function GetValue() {
  var val=document.getElementById("txtname").value;
alert(val);
 }

</script>

Monday, August 20, 2012

Java script validation on Server side in asp.net

Title:Java script validation in asp.net

Description :
As per previous articles,we discussed on java script validation on client side in asp.net .Now i would like give an example on validation which can be done on server side.In the below example i have used a web server control (Text box size) which should contain 30 characters with specified text format
Example:

if (TxtFormate.Text == "")
{
ClientScript.RegisterStartupScript(this.GetType(), "key", "<script>alert('Enter Format');</script>");
TxtFormate.Focus();
return;
}
if (int.Parse(TxtFormate.Text.Length.ToString()) > 30)
{
ClientScript.RegisterStartupScript(this.GetType(), "key", "<script>alert('Allows only 0 to 30 Characters');</script>");
TxtFormate.Focus();
return;
}

Wednesday, August 15, 2012

Scope of variables in javascript

In this post i will explain  how to declare and access of javascript variables.If a variable is declared inside of a function with "var" then it is local variable.
var a;-->//global
function f1()
{
//logic
}
If a variable is declared outside of a function with "var" then it is global variable.If a variable is declared implicitly any where in the code then it is global unlike other languages.
function f2()
{
var a; -->//local variable .It can access only this function
c=10;-->implicitly created.That's why global
}
We can redefine a global variable locally by declaring global variable again inside a function .Inside a function any reference will redirect to local variable only,we can use this keyword to refer global variable like this a=10;||refer to global a
function f3()
{
var b;//redefined
}

Thursday, June 28, 2012

how to get browser name in Jquery/javascript

Title: JQuery Get browser name in Asp.net

Description:
While working with web application we need to set or get some browser compatibility settings as per requirement.Now i would like to describe how to resolve some design issues of asp button  control based on browser using JQuery.In Java script we have an object "navigator" ,which can be used to get the browser name in java script.Here i converted the navigator user value  to upper case letters ,then based on  condition i will filter the browser.
Javascript:
<script>
window.onload(GetBrowserDemo());
function GetBrowserDemo()
{
var btnid=document.getElementById("<%=btntest.ClientID%>");
var browservalue = navigator.userAgent.toUpperCase(); 
if(browservalue .indexOf("FIREFOX") > -1)
{ 
alert('FireFox');
btnid.val="Test"
} 
else if(browservalue .indexOf("MSIE") > -1)
{ 
alert('IE');
btnid.val="Edit";
} 
else if (browservalue .indexOf("CHROME") > -1)
{
alert('Chrome');
btnid.val="update";
} 
}
</script>
Jquery:
$(document).ready(function() {
if ($.browser.msie){
alert('It is IE');
}
if( $.browser.opera){
alert('It is Opera');
}
if ($.browser.mozilla){
alert('It is Mozilla);
}
if( $.browser.safari ){
alert('It is Safari');
}
});
}
In JQuery ,It has an object "browser" to get the current browser name .if we use the JQuery ,we  have to add the jquery reference library . Please refer this link 

Jquery browser Objet with examples

Thursday, March 29, 2012

get month and year in jquery

Earlier i explained how to Jquery Get next and previous month. Here i will show how to get the current month/Date name from month index using java script. For this i have taken one array variable with month names .Then the result month index will be passed to month names array.Here the resulted month name is assigned to Div using present() function.If we want to get the current year there is an option to get the year i:e getFullYear();
<html>
<head>
<script>
var cdt = new Date();
var monthNames = ["January", "February", "March", "April", "May", "June",
"July", "August", "September", "October", "November", "December"];
var current_month = cdt.getMonth();
var month_name = monthNames[current_month];
var current_year =cdt.getFullYear();
     
function present() {
var cdt = new Date();
var month = monthNames[current_month];
var DivObj = document.getElementById('testmonth');
DivObj.innerHTML = month+','+" " + current_year;
}
<script></head>
<body><input type="submit" value="GetMonth" onclick="present()"/>
</body></html>
by using the above function we can get the current date by using Date functionality in jquery
var currentdate = cdt.getDate();

Wednesday, February 8, 2012

how to Passing a server side variable into javascript

Recently I have seen a server side code which is used to pass the server side value to javascript.So whenever we will transfer the server side value to Javascript we don't need to write server side .For this here i will show a simple way to pass the variable to javascript from server side
<input id="hidCtrl" type="hidden"  runat="server" value='<%# ServerVaribaleValue %>'/>
Here the server side value which is"ServerVaribaleValue" is assigned as a hidden field value.The below javascript will get the value of hidden field
<script language="javascript">
function onclick(){
alert(document.getElementById('hidctrl').value);
}
</script>

Sunday, December 18, 2011

Unselectable javascript Text

Making text un selectable is a cross-browser method for preventing text selection using this attr  .The no IE  browsers  also support this using some CSS.Here is the simple java script function it makes the controls in the page are unselected in IE browser
if($.browser.msie) {
this._mouseUnselectable=this.element.attr('unselectable');
this.element.attr('unselectable','on');
}
this.started=false;
}

If u want restore the text selection in IE the follow in java script can be helpful to allow selection in IE.I have used this script for allow the text selection in my jquery function
($.browser.msie
&& this.element.attr('unselectable', this._mouseUnselectable));
}

Monday, November 28, 2011

uncheck the check box if another check box checked in check box list or radio button list

Here i will unchecked  items  in radio button list server control or check box list server control when we select on any item in this  .For this i have used a  singleitemcheck() function for each item in list control .This function makes functionality is very quick in your application

Aspx Page:
<asp:radiobuttonlist id="contentcheck" repeatdirection="Horizontal" runat="server">
<asp:listitem onclick="singleitemcheck(this);">Home</asp:listitem>
<asp:listitem onclick="singleitemcheck(this);">Pages</asp:listitem>
</asp:radiobuttonlist>

Java Script:
function singleitemcheck(ch) {
            var chkList = ch.parentNode.parentNode.parentNode;
            var chks = chkList.getElementsByTagName("input");
            for (var i = 0; i < chks.length; i++) {
            if (chks[i] != ch&& ch.checked) {
                chks[i].checked = false;

Thursday, November 17, 2011

Get the file name from browser url using c#

In previous post we have seen how to pass java script variables to serverside.In this posti wll show how to get the browser information using csharp.Comparing to javascript there is no direct piece of code to get the file name with out extension in code behind using csharp.For this first we get the Absolute path from url then GetFileNameWithoutExtension property is used to remove the extension from path.using Here i have shown to get the file name using path in csharp

Code Behind:
string urlname=Request.Url.AbsolutePath;
string filename= System.IO.Path.GetFileNameWithoutExtension(urlname);
Java Script:
var fname= window.location.href;
var fname=window.location.href.substr(window.location.href.lastIndexOf("/") + 1); 
The sub string is used to get the file name with out extension.For example if path of the page is "defalut.aspx" then the output will be "Default"
If you want to get the raw url of from browser ,you need to write the below line of code.
 string Rawurlmain = HttpContext.Current.Request.RawUrl;
 string  Substringurl = urlmain.Substring(Rawurlmain .LastIndexOf('=') + 1);

Bel