How to pass id to textbox in javascript

[helloaspnet]

Heelllo to all,
Javascript is not a part of asp.net but to some extent we use it.so if any one have got idea plz do reply .
i am using datagrid and giving the user to select a date from a calender as a option .i surffered on internet and got some clues but the thing is
"i am unable to find the way how to pass id of the textbox to the javascript function ". If u didn,t get a idea plz tell me i will post the code for u.
ok then
byeee


helloaspnet

 

[ca8msm]

You can use the ClientID property of the TextBox to get a reference to the ID that will be written out to the page. e.g.

ClientScript.RegisterStartupScript(Me.GetType, "mykey", "alert('" & TextBox1.Text & "');", True)

____________________________________________________________
Mark,
[URL unfurl="true"]http://aspnetlibrary.com[/url]

Need help finding an answer? Try the Search Facility or read FAQ222-2244.

 

[jmeckley]

I think Mark meant

ClientScript.RegisterStartupScript(Me.GetType, "mykey", "alert('" & TextBox1.[COLOR=blue]ClientID[/color] & "');", True)

you could then use this value to get the dom object using document.getElementById(); exmaple

//client
<script>
function alertUser(controlId)
{
   var ctrl = document.getElementById(controlId);
   alert('ID = ' + ctrl.id + '; Value = ' + ctrl.value);
}
</script

//server
MyButton.OnClientClick = string.format("alertUser('{0}');", MyTextBox.ClientID);

when a user clicks MyButton the value of MyTextbox will be displayed in an alert box.

Jason Meckley
Programmer
Specialty Bakers, Inc.

 

[ca8msm]

Oops, well spotted again Jason


____________________________________________________________
Mark,
[URL unfurl="true"]http://aspnetlibrary.com[/url]

Need help finding an answer? Try the Search Facility or read FAQ222-2244.

 

[adamroof]

sry guys, just have to toss in my 2 cents...

asp.net IS javascript driven and can be extended in many ways. Hover over an asp link button on your web page and the status text from your browser even states javascript!

In a datagrid i have found an "easy" solution for passing the dynamic control id asp.net generates when its databound.

<ItemTemplate>
    <asp:TextBox id=txtBox runat=server onfocus="whoAmI(this,'txtBox2');" />
    <asp:TextBox id=txtBox2 runat=server />
</ItemTemplate>

Many people say - "I cant compile my site because onfocus is not an event of an asp:TextBox" - VisualStudio is a liar.

You can disable that validation event, or just ignore it and publish. You can add the javascript event serverside too, using the ItemDataBound event to find the control and add the attribute, but that takes out the "ease"!

You can manipulate via javascript the actions you need using the full dynamically created control ids of the datagrid/datalists and appending them to a passed in partial control id

function whoAmI(clicked, ctrl)
{
    var fullctrl = clicked.id.toString();
    var ctrlPos = fullctrl.split("_");
    if (ctrlPos[1]) //if the vars were split
        {
            alert('You Shouldn\'t Click In ' + ctrlPos[2] + ', You Should Be In ' + ctrl);
            try { //move them over to the passed in ctrl
                document.getElementById(ctrlPos[0] + "_" + ctrlPos[1] + "_" + ctrl).select();
            } catch (ex) { //the passed in ctrl wasnt a dropdownlist
                document.getElementById(ctrlPos[0] + "_" + ctrlPos[1] + "_" + ctrl).focus();
            }
        }
    else //the control passed in isnt inside a data control
    { document.getElementById(ctrl).focus(); }    
}

using that concept you can control the action of the user when they press enter when they "meant" to press tab...

using the onkeypress event of a textbox inside a datagrid item template

<asp:TextBox ID="txtExpectedDate" runat="server" Width="70" onkeypress="return checkEvent(this,event,'txtItemStatus');" Text='<%# DataBinder.Eval(Container.DataItem,"ExpectDate","{0:MM/dd/yyyy}") %>' />

change your target server control in the 3rd argument of the javascript function.

and heres the javascript

function checkEvent(clicked,e,ctrl)
{
    if(e && e.which){
        e = e;
        characterCode = e.which;
    }
    else{
        e = event;
        characterCode = e.keyCode;
    }
    if(characterCode == 13){        
        var fullctrl = clicked.id;
        var ctrlPos = fullctrl.split("_");
        var linkToFocus;
        if (ctrlPos[1])
        {
            try {
                document.getElementById(ctrlPos[0] + "_" + ctrlPos[1] + "_" + ctrl).select();
            } catch (ex) {
                document.getElementById(ctrlPos[0] + "_" + ctrlPos[1] + "_" + ctrl).focus();
            }
        }
        else
        {
            document.getElementById(ctrl).focus();
            return false;       
        }        
    }
    else {        
        return true;
    }
}