Jump to content


Check out our Community Blogs

Register and join over 40,000 other developers!


Recent Status Updates

View All Updates

Photo
- - - - -

Append in dynamic div

jquery html javascript

This topic has been archived. This means that you cannot reply to this topic.
1 reply to this topic

#1 Apprentice123

Apprentice123

    CC Devotee

  • Senior Member
  • PipPipPipPipPipPip
  • 457 posts

Posted 06 July 2015 - 10:27 AM

Hello

 

I create a dynamic div by information from my JSon file:

function loadJsonData(json, data){
	if(data == 'inventory'){
		for(var i=0; i<json.length; i++){
			var trCreate = "<tr>";
			trCreate = trCreate + "<td>" + json[i].Format + "</td>";
			trCreate = trCreate + "<td>" + json[i].Product + "</td>";
			trCreate = trCreate + '<td><input style="text-align:center" size="2" type="text" value=' + json[i].StockMin + ' /></td>';
			trCreate = trCreate + "<td>" + json[i].Stock + "</td>";
			if(json[i].Suppliers != undefined){
				trCreate = trCreate + '<td><input style="text-align:center" size="2" type="text" value=' + json[i].Suppliers[0].Order + ' /></td>';
				trCreate = trCreate + '<td><input style="text-align:center" size="5" type="text" value=' + json[i].Suppliers[0].Cost + ' /></td>';
			} else{
				trCreate = trCreate + '<td><input style="text-align:center" size="2" type="text" value=0 /></td>';
				trCreate = trCreate + '<td><input style="text-align:center" size="5" type="text" value=0.00 /></td>';
			}
			trCreate = trCreate + '<td><input style="text-align:center" size="5" type="text" value=' + json[i].Retail + ' /></td>';
			trCreate = trCreate + '<td><input name="Submit1" type="submit" value="submit" /></td>';
			$("#entry-data-table tr:last").after(trCreate);
		}
	} else if(data == 'customer'){
			for(var i=0; i<json.length; i++){
				var divCreate = '<div id="div-customer-id-' + i + '" class="column-customer" onclick="customerClick(' + i + ')">' + json[i].CustomerName + ' </div>';
				divCreate = divCreate + '<div id="div-order-id-' + i + '" class="column-Order">Order [ $ 220.00 ]</div>';
				divCreate = divCreate + '<div id="div-invoice-id-' + i + '" class="column-Invoice">Invoice [ $00.00 ]</div>';
				divCreate = divCreate + '<div id="div-paiment-id-' + i + '" class="column-Paiement">Paiement [ $ 120.00 ]</div>';
				divCreate = divCreate + '<div id="div-statement-id-' + i + '" class="column-Statement">Statement [ $4503.23 ]</div>';
				$("#customers-div").append(divCreate);
			}
	}
}

When I click on customer and call the function: customerClick()

I want to append a new div after that div that I clicked. How can I do that?

 

 

 



#2 dargueta

dargueta

    I chown trolls.

  • Moderator
  • 4854 posts

Posted 06 July 2015 - 08:45 PM

If you have this in your HTML:

<div onclick="customerClick(this)">
    <!-- Contents go in here -->
</div>

...then this will work:

function customerClick(customer_div) {
    // Do stuff to create a jQuery element here, then:
    $(customer_div).append(element);
}

Edited by dargueta, 06 July 2015 - 08:46 PM.

sudo rm -rf / && echo $'Sanitize your inputs!'





Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download