javascript pass control names as function parameters

Question

I am trying to pass some control IDs from code behind to html but I do not know the control names in advance as they are created dynamically and hence I cannot use something like this: MyTextBox = document.getElementById("<%= TextBox1.ClientID %>");

How can I make the following code work (if it is possible that is):

            TextBox test = ((TextBox)e.Row.Cells[7].Controls[0]);
            test.ID = "TextBox1";
            TextBox test2 = ((TextBox)e.Row.Cells[8].Controls[0]);
            test2.ID = "TextBox2";
            test.Attributes.Add("onChange", "javascript:MyFunc(TextBox1, TextBox2);");

JS function:

function MyFunc(TextBox1,TextBox2) {
            MyTextBox = document.getElementById("TextBox1");
            MyTextBox2 = document.getElementById("TextBox2");

            var splitDate = MyTextBox.value.split('/');
            var date = new Date(splitDate[2], splitDate[1] - 1, splitDate[0]);

            var day = date.getDate();
            var month = date.getMonth() + 1;
            var year = date.getFullYear() + 1;
            if (day < 10) {
                day = '0' + day;
            }
            if (month < 10) {
                month = '0' + month;
            }

            MyTextBox2.value = day + "/" + month + "/" + year;
        }

Arun P Johny · Accepted Answer · 2013-07-16 08:33:47Z

1

since the ids are variables, you should not enclose it with ""

var MyTextBox = document.getElementById(TextBox1);
var MyTextBox2 = document.getElementById(TextBox2);

Also you need to change

test.Attributes.Add("onChange", "javascript:MyFunc('TextBox1', 'TextBox2');");

because both TextBox1 and TextBox2 has to be passed as strings

answered Jul 16, 2013 at 8:33

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

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

5 Comments

sd_dracula Over a year ago

I have tried that just now and it seems that it still does not recognize TextBox1. I get this: 0x800a138f - JavaScript runtime error: Unable to get property 'value' of undefined or null reference

Arun P Johny Over a year ago

can you add a alert(TextBox1) at beginning of the function and see what is alerted

sd_dracula Over a year ago

It shows TextBox1 and then it breaks at: var splitDate = MyTextBox.value.split('/'); The textboxes are created dynamically when a user clicks edit in a gridview row and the code behind gets called from the RowDataBound function of the gridview

Arun P Johny Over a year ago

can you inspect your dom and see whether the id of the element is set properly

sd_dracula Over a year ago

I have fixed it with this: test.Attributes.Add("onChange", "javascript:MyFunc(this, + TextBox2.ClientID + ");"); and getting rid of these lines: MyTextBox = document.getElementById("TextBox1"); MyTextBox2 = document.getElementById("TextBox2");

DurGesh kuMar RAO · Accepted Answer · 2013-07-16 08:39:31Z

0

I think you can do like this,

 TextBox test = ((TextBox)e.Row.Cells[7].Controls[0]);
            test.ID = "TextBox1";
            test.Attributes.Add('class','TextBox1');
            TextBox test2 = ((TextBox)e.Row.Cells[8].Controls[0]);
            test2.ID = "TextBox2";
            test.Attributes.Add('class','TextBox2');
            test.Attributes.Add("onChange", "javascript:MyFunc(TextBox1, TextBox2);");

in JS:

function MyFunc(TextBox1,TextBox2) {
            MyTextBox = document.getElementByClass("TextBox1");
            MyTextBox2 = document.getElementByClass("TextBox2");

            var splitDate = MyTextBox.value.split('/');
            var date = new Date(splitDate[2], splitDate[1] - 1, splitDate[0]);

            var day = date.getDate();
            var month = date.getMonth() + 1;
            var year = date.getFullYear() + 1;
            if (day < 10) {
                day = '0' + day;
            }
            if (month < 10) {
                month = '0' + month;
            }

            MyTextBox2.value = day + "/" + month + "/" + year;
        }

answered Jul 16, 2013 at 8:39

DurGesh kuMar RAO

2844 silver badges13 bronze badges

1 Comment

sd_dracula Over a year ago

With this I get: 0x800a1391 - JavaScript runtime error: 'TextBox1' is undefined

Anirudh Agarwal · Accepted Answer · 2013-07-16 10:37:00Z

0

test.Attributes.Add("onChange", "javascript:MyFunc(" + TextBox1.ClientID + ", " + TextBox2.ClientID + ")");

try this if it help.

edited Jul 16, 2013 at 10:37

answered Jul 16, 2013 at 8:47

Anirudh Agarwal

7072 gold badges7 silver badges31 bronze badges

2 Comments

sd_dracula Over a year ago

If I do it like this: test.Attributes.Add("onchange", "javascript:MyFunc(this, 'TextBox2');"); I can get the actual value of TextBox1 to work ok but TextBox2 still says undefined

Anirudh Agarwal Over a year ago

Sorry, I have edited my answer the second one should be TextBox2

Collectives™ on Stack Overflow

javascript pass control names as function parameters

3 Answers 3

5 Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related