This looks like a mix of JavaScript and PHP at the moment, so it's a
little hard to see where you want the dynamic element to come from or
where it's meant to go.
If you had rows of existing customers:
Customer 1
Customer 2
Customer 3
and then wanted to add another customer below that, you could have a
single row with a button in it, and have that insert your next row
above itself, leaving the button in place:
$('yourButtonId').observe('click',function(evt){
evt.stop();
this.up('tr').insert({before:'<tr><td>your row template content here</
td></tr>'});
});
Also, there's no need to write out all the Ajax stuff you did.
Prototype makes that a one or two-liner. Let's say you wanted to get
the next row from the server, which would create the element, give it
an ID that didn't clash with anything else, etc.:
$('yourButtonId').observe('click',function(evt){
evt.stop();
var elm = this.up('tr');
new Ajax.Updater(elm,'path/to/script.php',
{insertion:'before',evalScript:true});
});
Your script.php would write out the HTML and JS needed to create the
TR and a script block with the autocompleter in it, and Updater would
insert that code above the row containing the button. Another way to
manage that (so you don't have to add a separate autocompleter for
each row) is to have a single function that listens for a click on the
table, inspects the object that was clicked on, and if it had a
classname like 'autocomplete' or whatever, dynamically insert the
autocompleter when it's needed. I've done this before with the In
Place Editor, never the autocompleter, but it seems to me it should
work.
Walter
PS: If you have to support older versions of IE, be sure to add a
<tbody> tag to your table, or else you will find it difficult to add
rows into it.
On May 18, 2010, at 2:52 PM, Lars Knudsen wrote:
Greetings.
I am rather new to this Script.aculo.us - so please be gentle ;-)
I am trying to create something like this:
<pre>
<table>
<tr><td><input type=text name=a_id_$x>
</td></tr>
<tr><td><input type='button'
onclick='javascript:add_interface_line($x, ".$row["customer_id"].", ".
$asset_id.");' name=addinterface value='Add Interface Line'
title='Adds one line'></td></tr>
</table>
</pre>
And dumping something like this on it:
<pre>
function eventCallback(element, entry)
{
alert (entry + '&q=' +
$('assetInterfaceID_'+counter
+'_IP').getValue() + '&counter='+counter+'&c_id='+customer_id);
return entry + '&q=' +
$('assetInterfaceID_'+counter
+'_IP').getValue() + '&counter='+counter+'&c_id='+customer_id;
}
function add_interface_line(counter, customerid,
assetid)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera,
Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new
ActiveXObject('Microsoft.XMLHTTP');
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 &&
xmlhttp.status==200)
{
var newdiv =
document.createElement('div');
newdiv.innerHTML =
xmlhttp.responseText;
var container =
document.getElementById('newinterface');
container.appendChild(newdiv);
new Ajax.Autocompleter
(
'assetInterfaceID_'+counter+'_IP',
'autocomplete_choices','printiphint.php',
{
fullSearch: true, frequency: 0, minChars: 1, callback:
eventCallback
}
)
}
}
xmlhttp.open('GET','printnewinterface.php?q='+counter
+'&c_id='+customerid+'&a_id='+assetid,true);
xmlhttp.send();
}
</pre>
Of course there is ample div's for it to handle returnable data. But
what it does not work right..
could anyone help me with it?
Basicly I need dynamicly addition of rows with interface information..
among those an IP field with autocomplete - in every row.
--
You received this message because you are subscribed to the Google
Groups "Prototype & script.aculo.us" group.
To post to this group, send email to [email protected]
.
To unsubscribe from this group, send email to [email protected]
.
For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en
.
--
You received this message because you are subscribed to the Google Groups "Prototype
& script.aculo.us" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
