asked on

dynamic button & php

Hey guys,

I'm new in html and php so, sorry if my question seems clear and easy! Anyway, In my table I've a problem with dynamic Buttons! I'm trying to create a dynamic buttons each with same id+1 (starting from id 1) and I want to sent the data from also dynamic textfield to my database! Knowing that I'm using javascript to generate these buttons and fields and jQuery to parse the data to .php file (if there is easiest way please help me!).

Here is a part of my code..
using javascript i generate a button:

var cell8 = row.insertCell(8);
var itAd = document.createElement('input');
itAd.setAttribute('type', 'submit');
itAd.setAttribute('name', INPUT_NAME_PREFIX + iteration);
itAd.style.width = "100%";
itAd.setAttribute('value', "Add");
itAd.id="add"+iteration;

itAd.setAttribute('onclick', 'addRowToTable()');

$(document).ready(function(){
$("div#msgbox").hide();
$("#add".iteration).click(function() {
$.post('insert.php', {
proid: $("#proid".iteration).val(),
brand: $("#brand".iteration).val()
},
function(response){
$("div#msgbox #msg").html("Item added successfully..");
$("div#msgbox").hide().slideDown("normal");

}
);
return false;
});
$("div#msgbox").click(function(){
$(this).slideUp("normal");
})
});

The HTML code is:
<table border=1 id="item_Table" width=73%>
<tr>
<th style="width:4%; size:20px;">#</th>
<th style="width:10%; size: 5px">Product ID</th>
<th style="width:10%; size: 5px">Brand</th>
<th style="width:4%"></th>
</tr>
</table>

leakim971

add this (in bold) :
var cell8 = row.insertCell(8);
var itAd = document.createElement('input');
itAd.setAttribute('type', 'submit');
itAd.setAttribute('name', INPUT_NAME_PREFIX + iteration);
itAd.style.width = "100%";
itAd.setAttribute('value', "Add");
itAd.id="add"+iteration;
itAd.className = "addButton";

and replace :
$("#add".iteration).click(function() {
by :
$(".addButton").live("click", function() {

more info : http://api.jquery.com/live/

leakim971

hmm... I miss the point you want to post the right data, so use :

$(".addButton").live("click", function() {
$.post('insert.php', {
var iteration = $(this).attr("id").replace("itAd","");
proid: $("#proid" + iteration).val(),
brand: $("#brand" + iteration).val()
},
function(response){
$("div#msgbox #msg").html("Item added successfully..");
$("div#msgbox").hide().slideDown("normal");

}
);
return false;
});

leakim971

sorry correction :

$(".addButton").live("click", function() {
var iteration = $(this).attr("id").replace("itAd","");
$.post('insert.php', {
proid: $("#proid" + iteration).val(),
brand: $("#brand" + iteration).val()
},
function(response){
$("div#msgbox #msg").html("Item added successfully..");
$("div#msgbox").hide().slideDown("normal");

}
);
return false;
});

leakim971

this line :
var iteration = $(this).attr("id").replace("itAd","");

help us to retrieve the iteration from the button ID, we replace itAd by nothing

s3adcom

ASKER

Thanks for answering my question, but I still have one problem which is I can't access the page "insert.php". It seems that the $.post doesn't work correctly! I tried to put it in the <form> and out of it but still facing the same problem!

Again thanks and hope you can help me on this..

leakim971

please provide a link to your page

s3adcom

ASKER

Attached is my page! Thanks a lot for your help. InventoryManagement.php

leakim971

everything run fine on my side
I asked a link to your page to see it running not the source

s3adcom

ASKER

I'm running my code in locally, where "insert.php" is just print anything just to make sure it goes there, because now nothing happen if when I call it! Though, not sure what you mean.

leakim971

leakim971-510323.flv

s3adcom

ASKER

Yes this is work fine! however, I want to add these fields to my db and first I want to know if the $.post works or not when I click on "Add" button. It seems that $.post doesn't go to "insert.php"!! Just to make it clear, the "Add" button should insert the row to my db and also add new row in my table.

leakim971

replace :
itTp.id="Type"+iteration;
by :
itTp.id="type"+iteration;

and replace :
var iteration = $(this).attr("id").replace("itAd","");
by :
var iteration = $(this).attr("id").replace("add","");

it will work

s3adcom

ASKER

I'm sorry, but its not working!
Really thank you for your time and cooperation, means a lot!

ASKER CERTIFIED SOLUTION

leakim971

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

s3adcom

ASKER

Thank you very much!! It works now.