php - Javascript, onClick event is producing different than I asked -
php - Javascript, onClick event is producing different than I asked -
i'm designing web project cooking recipes. when user wants add together ingredient recipe, needs add together ingredients 1 1 using dynamic list i'm trying code jquery(ajax).
my problem is, if user enters 1 word ingredient, works great. if user enters more 1 word ingredient, weird things happening. (yes cannot explain what's going on. newbie javascript coder spotted.) here codeline:
$("#inglist").append("<br id="+i+"><div id="+i+">"+$("#ingredient").val()+" <a href='#' onclick=removeingr('"+ingr+"',"+i+")>remove</a></div>");
this codeline suppose add together <br>
, <div>
tags, index number of ingredient id attribute, name of ingredient (from input line id ='ingredient') tag onclick event calls removeingr(ingredientname,index) method
if user enters "tomato", produces this:
<div xmlns="http://www.w3.org/1999/xhtml" id="0">tomato <a onclick="removeingr('tomato',0)" href="#"> remove</a></div>
it looks , works cool. (except i've realized that, href attribute moving end somehow.)
if user enters "black pepper", produces this:
<div xmlns="http://www.w3.org/1999/xhtml" id="3">black pepper <a pepper',3)="" onclick="removeingr('black" href="#">remove</a></div>
as see, mixed each other. what's happening? help?
thanks time.
you need quotes around onclick
attribute, otherwise space marks end of it. utilize \"
have quotes within quotes.
$("#inglist").append("<br data-id='"+i+"'><div data-id='"+i+"'>"+$("#ingredient").val()+" <a href='#' onclick=\"removeingr('"+ingr+"',"+i+")\">remove</a></div>");
i've changed id
attributes data-id
, because shouldn't have multiple elements same id
, nor should id
s start number.
php javascript jquery ajax
Comments
Post a Comment