Page 1 of 1

javascript form generator without refreshing page...

Posted: Mon Sep 20, 2004 9:21 am
by mudkicker
hey people,

i want to have a form generator for example.

i have a basic form and one of the inputs is:

"How many books are in this set?"

someone enters here on and then press generate.
then it will open without refreshing page, 10 text fields and he will enter book names etc.. then he submits the form and all data will be saved in database. is there any way to do this?

i wait for your ideas or codes etc...
thanks :cry:

Posted: Mon Sep 20, 2004 9:47 am
by CoderGoblin
Fairly easy to do in theory but can get complicated in the long term....

For instance, what happens if someone changes the number of books halfway through.

Does this mean that all excess book fields get deleted or only those which are empty ?.

You may want to look at
viewtopic.php?t=13891

Personally I use a function

Code: Select all

function changeElemContent(elementId,content) {
  if(document.implementation &&
    document.implementation.hasFeature &&
    document.implementation.hasFeature('Range','2.0')) {

    // Can use ranges (Netscape 6+)
    node = document.getElementById(elementId);
    var newRange = document.createRange();
    newRange.selectNodeContents(node);
    newRange.deleteContents();
    var newHTML = newRange.createContextualFragment(content);
    node.appendChild(newHTML);

  } else {
    if(document.getElementById) {
      // Process using inner HTML (Explorer 5&6)
      document.getElementById(elementId).innerHTML=content;
    } else {
      // Other generic tries to match other browsers. Do not always work (e.g Netscape 4)
      if (document.all) {
        document.allїelementId].innerHTML=content;
      } else {
        if(document.layers) {
          with(document.layersїelementId].document) {
            open();
            write(content);
            close();
          }
        }
      }
    }
  }
}
but that might add more complexity than you need. (I'll let you figure out what it does :wink: )

TOM

Posted: Mon Sep 20, 2004 9:53 am
by phpScott
You will have to use the DOM subset TOM(table object model) of Javascript to do what you want
http://www.w3schools.com/js/tryit.asp?f ... _insertrow
has a nice example of how to do it.

I think this would be your best be because you don't want to reload the page.

phpScott

Posted: Mon Sep 20, 2004 10:26 am
by mudkicker
thanks i will look @them and tell what i can't get. thank you very much.

Posted: Mon Sep 20, 2004 11:05 am
by mudkicker
http://www.w3schools.com/js/tryit.asp?f ... _insertrow

this is what i want..
if i want to put text fields it adds.
the problem is, if i fill these text fields and submit the form of them. it doesn't take the values of them.. :(

strange is:

Code: Select all

<script type="text/javascript">
function insRow()
&#123;
var x=document.getElementById('tablo').insertRow(1)
var y=x.insertCell(0)
y.innerHTML="<input type="text" name="test&#1111;]">"
&#125;
</script>
this is the code i personalized. iwant add more than 1 text fields fill them and post in an array $post.

this is the way which doesn't work.

if i write the line like this:

Code: Select all

y.innerHTML="<input type="text" name="test">"
then it works but this is not for multiple text fields right?
any ideas?? :(

Posted: Mon Sep 20, 2004 1:22 pm
by PrObLeM
not not sure because i havent done alot of javascirpt but why not use a for loop basically...

Code: Select all

for(i=0; i<=somenumber; i++)
&#123;
y.innerHTML += "<input type="text" name="test">" ;    //So it adds the input box too the current html
&#125;

Posted: Tue Sep 21, 2004 8:48 am
by mudkicker
man...

:( stupid me..

it worked but i did wrote the code print_r wrong way.. >:)

well it works how i wrote too.. there's no problem in it...
just my blind eyes ;)