easy way to add javascript functions in asp.net web site

Question

I have around 10 to 12 functions in JavaScript. I want to call 2 or 3 of them in the event when control, get, focus, and other functions I used by those functions.

I have all those functions for virtual keypad ... I would like to add virtual keypad as on the master page (I have already created virtual keypad in JavaScript using HTML form).

I have already added that code into a master page and my keypad is working, but it only works with simple HTML controls (that is, having no runat="server" attribute). It doesn't work when I add runat="server".

I don't know how to call this functions from content or child pages.

My code is below:-- (this code for JavaScript that i added in master page...this is part of code(not full))

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage2.master.cs" Inherits="MasterPage2" %>

<!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 id="Head1" runat="server">
    <title></title>
    <script language="javascript" type="text/javascript">

        function setId(el) {
            id = el;
            //alert(el);
            document.getElementById(id).focus();
            reset();
            return 0;
        }  

        function restoreCode(evt) {
            ButtonUp(kcode);
        }

        function writeKeyPressed(evt) {
            InsertChar('k', kcode);

            return false;
        };

        function InsertChar(mode, c) {
            document.getElementById(id).focus();
        }

        function ButtonDown(c) {
            reset();
        }

        function ButtonUp(c) {
            //codes
            resets();
        }

        function Shift() {
            //codes
        }
    </script>

When I am calling it from content page that is HTML control not having runat="server" attribute in code then it will work.

 <input id="txt_pwd" type="password" onfocus="setId('txt_pwd');" />

When I am calling it from content page (that is, an ASP control having runat="server" attribute in code) then it will not work.

<input id="txt_pwd" type="password" onfocus="setId('txt_pwd');" runat="server" />

Please can any one tell me a solution that I will call my function (having on the master page) using server side control from content page.

You need some more clarification to be helped: Please include the examples of how you are calling it. What errors are you getting? What does "it will not work" mean in detail? Also, how are you using an asp control without runat="server"? — MikeSmithDev
– MikeSmithDev, Commented Mar 27, 2013 at 12:56
@MikeSmithDev ..sorry it is only html control without runat="server"...and it will not work means...when i press on my virtual keypad the keys are write on the textbox that is not happening with this case... — nik
– nik, Commented Mar 27, 2013 at 13:45
@CodeRider i am using a virtual keyboard...in which i am processing two different ways.1 is using imagemap(html) that is user click on that button and character is written on textbox ..2 is that the user directly write on textbox and i will display uincode relative to that... for ex...hindi(non-english) language keyboard provide by google translator — nik
– nik, Commented Mar 27, 2013 at 13:48

MikeSmithDev · Accepted Answer · 2013-03-27 14:14:03Z

1

It isn't working when you use runat="server" because .NET changes the ID of controls. So in the runat="server" case, your JavaScript is looking for the wrong id. One way to fix it is to tell .NET not to change the ID using the ClientIDMode.

<input id="txt_pwd" type="password" clientidmode="Static" onfocus="setId('txt_pwd');" runat="server" />

There are other ways to get the generated ClientID if you don't use static mode, as you wouldn't want to use that in repeaters or if there is a chance the ID may be a duplicate. In that case, you can use .ClientID, as in:

document.getElementById('<%= txt_pwd.ClientID %>');

Reading on ClientID

An easier approach may just be to use onfocus="setId(this);" and then

function setId(el) {
    id = el.id;

edited Mar 27, 2013 at 14:14

answered Mar 27, 2013 at 13:59

MikeSmithDev

15.8k4 gold badges61 silver badges91 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

easy way to add javascript functions in asp.net web site

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related