Re: Creating multiple input fields using javascript - Web Development Discussion Boards

Try using "valign: bottom;".

How we can show live video on a website,while the video cameras are located on different location and we will provide IP address of that camera?

Nida

Can you give any example using this code. I will thankful to you.

Nida

if you are using ASP.NET with C#

protected override void CreateChildControls()
{
base.CreateChildControls();
this.Controls.Add(new LiteralControl("<object id="\""));
" this.controls.add(this.literal1);
="" this.controls.add(new="" literalcontrol("\"="" style="\"WIDTH:" 100%;="" height:="" 100%\"="" classid="\"clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6\"" viewastext="">"));
this.Controls.Add(new LiteralControl("<param name="\"URL\"" value="\""));
" this.controls.add(this.literal2);
="" this.controls.add(new="" literalcontrol("\"="" />"));
this.Controls.Add(new LiteralControl("<param name="\"rate\"" value="\"1\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"balance\"" value="\"0\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"currentPosition\"" value="\"0\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"defaultFrame\"" value="\"\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"playCount\"" value="\"1\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"autoStart\"" value="\"-1\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"currentMarker\"" value="\"0\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"invokeURLs\"" value="\"-1\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"baseURL\"" value="\"\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"volume\"" value="\"50\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"mute\"" value="\"0\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"uiMode\"" value="\"full\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"stretchToFit\"" value="\"0\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"windowlessVideo\"" value="\"0\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"enabled\"" value="\"-1\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"enableContextMenu\"" value="\"-1\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"fullScreen\"" value="\"0\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"SAMIStyle\"" value="\"\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"SAMILang\"" value="\"\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"SAMIFilename\"" value="\"\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"captioningID\"" value="\"\"" />"));
this.Controls.Add(new LiteralControl("<param name="\"enableErrorDialogs\"" value="\"0\"" />"));
this.Controls.Add(new LiteralControl(""));
}

public string PlayAddress
{
get
{
return this.Literal2.Text;
}
set
{
this.Literal2.Text = value;
}
}

</code>Hey,
I am trying to create multiple jscript input fields, once a user clicks on a button.
Basically the click on a button and a new set of input fields is added (many of these could be made, its the users discretion.)

Im having problems.
here is some of my code.
<code>
<script>

var cfields= new Array();
var x = 0;
function showFields()
{
var divID= 'results';
var output='';

output+= '<div style="border: 1px solid; width: 151px;padding: 3px;" id="announcements"><input type="text" value="URL"><br>'+
'<input type="text" value="Headline"></div>';

output+='';

document.getElementById(divID).innerHTML = output;
}

///////////////////////////////////////
//
//////////////////////////////////////

function newField()
{
var foo = new showFields();
cfields.push(foo);
alert(cfields);
x++;
}

</script>

<body>


<br /><br />

<table>
<tr>
<th><p>Email Generator</p></th>
</tr>
<tr>
<td>
<div style="border: 1px solid; width: 151px;padding: 3px;"><input type="text" value="Date"></div>
</td>
</tr>
<tr>
<th align="left"><p>Announcements</p></th>
</tr>
<tr>
<td>
<div style="border: 1px solid; width: 151px;padding: 3px;" id="announcements'+x+'"><input type="text" value="URL"><br>
<input type="text" value="Headline"></div>

<div id="results"></div>
</td>
<td valign="top">
<div style="border: 1px solid; width: px;padding: 3px;" align="center"><input type="button" value="+" onClick="showFields();"><br>
<input type="button" value="-"></div>
</td>
</tr>

</code>
I tryed to create a new array and stick a new instance of the function into it.
This is not working. Someone please help me.

<html>
<head>

<script>
var d=document;
var fldArray=new Array();
var IDcount=0;

function Field(){
this.fldID=0;
this.fldObj=0;
this.isAppended=0;
//Methods
this.CreateField=GCreateField;
this.AppendField=GAppendField;

}

function GCreateField(){
var newFld=d.createElement("DIV");
newFld.id="announcements"+IDcount;
IDcount++;
newFld.className="cFld";
newFld.innerHTML="<input type=\"text\" value=\"URL\"><br>"+"<input type=\"text\" value=\"Headline\"><br>";
this.fldID=newFld.id;
this.fldObj=newFld;
}

function GAppendField(parentID){
if(!this.isAppended){
var parentObj=d.getElementById(parentID);
parentObj.appendChild(this.fldObj);
this.isAppended=1;
}
}

function GAddField(){
var newFld=new Field();
fldArray.push(newFld);
window.defaultStatus=fldArray.length;
}

function GShowField(index){
if(fldArray[index]!=undefined){
fldArray[index].CreateField();
fldArray[index].AppendField("results");
}
}

</script>

<style>
.cFld {
}

</style>
</head>
<body>

Content:<br>
<div id="results"></div>

<input type="button" value="+" onClick="GAddField()"><br>
<input type="button" value="-">

<input type="button" value="Show 0" onClick="GShowField(parseInt(d.getElementById('fldInd').value))">
<input type="text" value="index to show" id="fldInd">
<!-- If the Status shows 5 the last index is 4.
</body
</html>

I hope this helps.

Hey thanks for that script, I do appologize I have not used it, I sort of already created my own, using DOM as well.

here is what I have:
<code>
<html>
<script>
var annouceInputs = 1;
//////////////////////////
//Creates new announcement
//////////////////////////
function addAnnounce()
{

var table = document.getElementById('annoucementData');
var tr = document.createElement('TR');
var td2 = document.createElement('TD');
var td3 = document.createElement('TD');
var inp1 = document.createElement('INPUT'); //url for announcement
var inp2 = document.createElement('INPUT'); //headline for announcement
var breaks= document.createElement('br');
var inp3 = document.createElement('INPUT'); // delete "-" button
var p1 = document.createElement('p');
var p2 = document.createElement('p');
var inp4 = document.createElement('INPUT');
var break2 = document.createElement('br');
if(annouceInputs>0)
{
var img = document.createElement('IMG');
inp3.setAttribute('type', 'button');
inp3.setAttribute('value', '-');
inp4.setAttribute('type', 'button');
inp4.setAttribute('value', '+');
p1.className='delete';
inp1.className= 'delete';
inp2.className= 'delete';

td3.appendChild(inp4);
td3.appendChild(break2);
inp3.onclick = function()
{
removeElement(tr);
}
inp4.onclick = function()
{
addAnnounce();
}

td3.appendChild(inp3);
}
inp1.setAttribute("name", "announceUrl"+annouceInputs);
inp1.setAttribute("value", "URL"+annouceInputs);
inp2.setAttribute("Name", "annouceHeadline"+annouceInputs);
inp2.setAttribute("value", "Headline"+annouceInputs);
table.appendChild(tr);

td2.style.paddingLeft = "50px";
tr.appendChild(td2);
tr.appendChild(td3);
td2.appendChild(inp1);
td2.appendChild(breaks);
td2.appendChild(inp2);

annouceInputs++;
}
//////////////////////////////
//Removes the new Child element
//////////////////////////////
function removeElement(tr)
{
tr.parentNode.removeChild(tr);
}
</script>

<body onload="addAnnounce();" >

<br /><br />
<FORM NAME="myform" ACTION="#" METHOD="GET">
<table>

<tr>
<th><p>Email Generator</p></th>
</tr>
<tr>
<td style="padding-left: 50px;">
<input class="delete" type="text" name="date" value="Date">
</td>
</tr>
<tr>
<th align="left"><p>Announcements</p></th>

<td valign="top">
<input type="button" value="+" onClick="addAnnounce();">
</td>
</tr>
<tr>
<tbody id="annoucementData" valign="top" border="1">
</tbody>
</tr>
</table>
</FORM>
</body>
</html>
</code>
Now you can put that into a temp page and see waht it actually does.
The problem that I am Having now, is that I dont know how to collect the data if
someone were to actually fill out the input boxes. (lets say they fill out 4 sets)

How do I collect the data?
Please help, and thanks
Wally

Well it depends when you want to collect the data. Basicly you need
to asign an id to the two input fields, but that you already know.
You may want to post it to some server side script or to do something
with the data in the JavaScript. You may want to collect it when some internel(for the announcement) event occurs. Then it's better to implement the event
handler in a DOM class and each item handles it self. Or you can declare
a global array to keep the fields in it( the whole object or just the
field ids).
If you have their ids you can easily collect the data and do whatever you want with it.

Nice, thanks a bunch.

Is it possible for a non admin user to create virtal dirs/administrator iis? If yes how?

Thanks
Dinuj Nath

I use an ItemDataBound event to set each column's text in a row in a grid to an element with an 'onclick' event defined. The event calls a function that does an ajax callback.

Now because the elements have no href attribute, they are just plain text, and therefore I have the reverse effect of the mouse cursor being a pointer when not over text, but changing to a caret when over text. This is not intuitive as the use is not cued to click the text.

How can I determine the mouse cursor displayed over the elements in my row?

I believe elements have an onmouseover property that you can call a javascript function for...I've used it to set the window.status when someone's cursor hovers over an element.

I've also done something similar to this by setting the style of an html cell. You can set this: Style="Cursor:Hand" to make the cursor turn into a hand whenever it is on this cell.

Hope this at least points you in the right direction.

hello there...
Suppose i already have some web pages under the following, www.blablabla.com, and i want to update some data or modify some menus, add some texts, so how am i going to do so? wat methods?
Any help and iam thanksfull.......

scorp_scorp

Please ask specific problems and also in a bit detail. Smile | :)

Best Regards,
Apurva Kaushal

well, details , mmmm lets seee........
Suppose i created a website (# of webpages) , i gave it for certain company to host it and load it, so, so its www.adc.com, then i wanted to add another item in a certain menu in the first page, or i want to change certain text in a page (Welcome ALL ) to (hey every body), so how i can do this, shall i go to them, nock the door, go insidem, open the pages, adjust them and save, ofcourse not...
Hope i explained in details, thanks Apurva Kaushal, waiting ur answer. Smile | :)

scorp

No ofcourse not in that way. But to change anything you need to know how exactly they are being displayed. What technology they have used to create the site. Whether it asp.net, plain html page or what. Smile | :)

Best Regards,
Apurva Kaushal

mmmmm ok dude, thanks alot. Smile | :)

scorp

always welcome.. Smile | :)

Best Regards,
Apurva Kaushal

how can i apply 'bold' as style to the selected text of label control.

The applied 'bold' to the selected text should remain even after some navigation to the other pages in the application.

kamalnath

How to make a textbox not accept certain words?

Example : can not contain word "dog" in a string

I hv tried negative lookahead (?!regexp) and many other method i found through google, but none of them work. I'm using RegularExpressionValidator in VS 2003. Izzit related?

-- modified at 2:01 Wednesday 27th September, 2006

You can use javascript regular exepression for that purpose:
here you can get the required help regarding javascript regular expression:
http://www.webreference.com/js/column5/[^]
http://www.javascriptkit.com/javatutors/re.shtml[^]
Smile | :)

Best Regards,
Apurva Kaushal

Anyway, Thx for your help.

But i'm quite new to regular expression. I still not sure what to put. Appreciate if someone can give me the solution. Thx

It depends what exactly you want your user not to put in the textbox. I hope it won't be "dog" as you mentioned. Smile | :)

Best Regards,
Apurva Kaushal

haha, it just an example.

Finally i found the solution.

^((?!(illegal)).)*$

but regular expression is case sensitive. that's mean words like "illegAL" will not work... i think i better use back the .net code... anyway, thx ..