Hello, Ali, Thank you very much for coming back to this post.
At the moment, I have just used a simple <div id="price"/> tag and it works great. Once I do more work on AJAX, I will put your suggestions in. K . akimoto Quoting "Mesdaq, Ali" <[email protected]>: > Hello, > > I am the one who wrote that article sorry if it wasnt clear enough > to help you out here. Looking at the code you pasted I see a few > places where I think the issue might be. > > In your subscriptions_quote.js file you dont have the price element > defined like in my example. What you need is a reference to the > element and you dont have one. So add something like var price = > getElement('price'); right under your var check_price = > getElement('check_price');. That will give you a reference to that > element that you will need when you call replaceChildNodes later. > Also a minor change you could add is change p_txt = > P({'style':'display:none'}, resp.data.price); to var p_txt = > P({'style':'display:none'}, resp.data.price);. > > One of the debugging steps you can take with firebug is to actually > watch the DOM get updated. If you right click somewhere on the page > thats close to where your price data will be displayed you can > select "Inspect Element" then navigate to where the element will be > created. Its possible that the element gets added to the DOM but you > have an issue with the appear() function so it never displays even > though its been inserted with the replaceChildNodes() that has > happened to me many times before. > > Also after you do var p_txt = P({'style':'display:none'}, > resp.data.price); I would do a console.log(p_txt); Just to dump that > DOM element and make sure its being created correctly with the > correct data as well as the correct attributes. You might even want > to not have it be set to display none so that you can take the whole > visual affect issues out of the debugging. > > Please let me know if this helps I am very interested in making sure > the issue is resolved based on the instructions I gave in the > tutorial instead of other work arounds. > > Thanks, > ------------------------------------------ > Ali Mesdaq (CISSP, GIAC-GREM) > Sr. Security Researcher > Websense Security Labs > http://www.WebsenseSecurityLabs.com > ------------------------------------------ > > > -----Original Message----- > From: [email protected] [mailto:[email protected]] > Sent: Sunday, April 12, 2009 8:50 PM > To: The elegant MVC web framework > Subject: [Catalyst] Catalyst-Ajax-Mochikit - followed tute but am > stuck. Cannot show values in view(webpage) > > hi everybody :) > > Referring to http://www.catalystframework.org/calendar/2008/24, I > have > made a small change to my app and tried developing it with AJAX. > > What's successful: > ================= > > *) managed to make a call to my controller - i put in a > $c->log->debug( > ... ) statement and saw that come up fine > > > What I have done to check: > ================= > > *) Used Firebug on firefox to check the returned object. > > > > Looks good in that it has > ================= > 1) 'status'='Successful' > 2) 'data' hash ref which even has 'price' => 'the value i expected'. > > > How do I actually get the value (which is the 'price' attribute to > display)? > Point of problem: addCallBack method in my javascript file. > > Where an I stuck: > ================= > *) can't seem to display values returned from JSON be it via span or > a > html table. > All I wanted to do was to get my controller to pass out a 'price' > value. > > > > here are my files: > > > the only template, 'form.tt2' > ------------------------------------------ > > > <span class="error" id="error"> > <ul> > [% FOREACH error IN errors %] > <li>[% error %]</li> > [% END %] > </ul> > </span> > <hr/> > [% END %] > <form method="post" action="[% > target_action > %]" id="agent_subscription_form" name="agent_subscription_form"> > <table border="0" cellspacing="3"> > <tr> > <td valign="top"> > insurance duration: > </td> > <td valign="top"> > <input type="text" > id="duration" name = "duration"/> > </td> > </tr> > > > <tr> > <td valign="top"> > Price > </td> > <td valign="top"> > <span class="price" > id="price"></span> > <input type="button" > id="check_price" name="check_price" value="check price"/> > <script > type="text/javascript" src="[% > Catalyst.uri_for('/js/subscriptions_quote.js') %]"></script> > </td> > </tr> > </table> > </form> > > > the javascript, subscriptions_quote.js > ------------------------------------------ > > //Creates MochiKit logging pane. Remove "true" if you want it popped > out > in its own window > createLoggingPane(true); > > var message = getElement('message'); > var error = getElement('error'); > var duration = getElement('duration'); > var check_price = getElement('check_price'); > > connect > ( > 'check_price', > 'onclick', > function () > { > log("I have been clicked and here are my values:"); > log("Duration: ", duration.value); > > //Creating our params object to hold our arguments that we > will > be posting > var params = > { > export_to: export_to.value, > duration: duration.value, > agent_code: agent_code.value > }; > > //Calling MochiKit's doXHR which makes XMLHttpRequests > painless > //'/usersubscriptions/get_price', > var d = doXHR > ( > '/users/subscriptions/check_price', > { > 'method': 'POST', > 'sendContent': queryString(params), > 'headers': > {'Content-Type':'application/x-www-form-urlencoded'} > } > ); > > > //Creating a callback on success to process our json response > d.addCallback > ( > function (req) > { > //eval'ing and assigning our returned json data to > resp > variable > var resp = evalJSONRequest(req); > > //logging to firebug as an example comment out if > not > installed > //console.log(resp); > > //Checking to see we have a successful response in > our > returned data > if (resp.status == 'Successful') > { > log('the Response has status of successful...'); > //creating dom elements. first arg pass is named > args for attributes > //second arg passed is data inside element. can > be > string or array of more > //elements consult mochikit docs for full > details > var td_price = TD(null, resp.data.price.value); > > > > log(resp.data.price); > > //calling our partial function > u_message(resp.status); > > //Calling MochiKit's appendChildNodes() to only > the > fly update the DOM > // appendChildNodes( agent_subscriptions, > [tr_price]); > > // Im stuck here!!! Don't know why the freakin' value won't show :( > > p_txt = P({'style':'display:none'}, > resp.data.price); > replaceChildNodes(price, [p_txt]); > > appear(p_txt,{'speed':0.1}); > > } > else > { > log('Response has status of NON successful'); > > //calling our partial function > u_message(resp.status); > > //getting error reason and txt and updating user > for (i in resp.error) > { > log('Error is:',i); > log('Reason is:',resp.error[i]); > u_error(i+': '+resp.error.i); > } > } > } > ) > > > } > ); > > > > > > > _______________________________________________ > List: [email protected] > Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst > Searchable archive: > http://www.mail-archive.com/[email protected]/ > Dev site: http://dev.catalyst.perl.org/ > > > Protected by Websense Hosted Email Security -- www.websense.com > > _______________________________________________ > List: [email protected] > Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst > Searchable archive: > http://www.mail-archive.com/[email protected]/ > Dev site: http://dev.catalyst.perl.org/ > > > _______________________________________________ List: [email protected] Listinfo: http://lists.scsys.co.uk/cgi-bin/mailman/listinfo/catalyst Searchable archive: http://www.mail-archive.com/[email protected]/ Dev site: http://dev.catalyst.perl.org/
