Re: [Proto-Scripty] Re: prototype to populate select box via ajax

2010-08-17 Thread Phil Petree
T.J.  YOU are a gentleman AND a scholar!  I looked everywhere for how to do
this!  Hopefully this post will move up in the search engines and others can
find it!

One other question on this...

What if the XML response is:
data
  other
stuffmore and more/stuff
  /other
  states
state code=CACalifornia/state
state code=AKArkansas/state
  /states
/data
How do I need to format this line?
   states = response.responseXML  response.responseXML.firstChild;

(I think I need a good primer on how this is working...  LOL)

Thanks,

Pete


On Tue, Aug 17, 2010 at 2:32 AM, T.J. Crowder t...@crowdersoftware.comwrote:

 Hi,

 The XML can be in whatever form you find useful to parse. Here's a
 complete example that handles an XML response that looks like this:

 statesstate code=CACalifornia/statestate code=AKArkansas/
 state/states

 Code (also -- more readably -- here: http://pastie.org/1097106):
 * * * *
 !DOCTYPE HTML
 html
 head
 meta http-equiv=Content-type content=text/html;charset=UTF-8
 titleTest Page/title
 style type='text/css'
 body {
font-family: sans-serif;
 }
 #log p {
margin: 0;
padding:0;
 }
 /style
 script type='text/javascript' src='http://ajax.googleapis.com/ajax/
 libs/prototype/1.6.1.0/prototype.jshttp://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js
 '/script
 script type='text/javascript'
 document.observe('dom:loaded', function() {
$('btnGo').observe('click', go);

function go() {
new Ajax.Request(getlist.jsp, {
onSuccess:  getlistSuccess,
onFailure:  getlistFailure,
on0:getlistFailure
});
}

function getlistSuccess(response) {
var states,
state,
selbox,
options;

// Validate response
states = response.responseXML 
 response.responseXML.firstChild;
if (!states ||
!states.tagName ||
states.tagName != states) {
getlistFailure(response);
return;
}

// Get the select box and its options array (not really an
 array)
selbox = $('selectbox');
options = selbox.options;

// Loop the states
for (state = states.firstChild; state; state =
 state.nextSibling) {
options[selbox.options.length] = new Option(
state.firstChild.nodeValue,
state.getAttribute(code)
);
}
}

function getlistFailure(response) {
log(getlist call failed);
}

var write = log;
function log(msg) {
$('log').appendChild(new Element('p').update(msg));
}
 });
 /script
 /head
 body
 input type='button' id='btnGo' value='Go'
 brselect id='selectbox'/select
 hr
 div id='log'/div
 /body
 /html
 * * * *

 HTH,
 --
 T.J. Crowder
 Independent Software Consultant
 tj / crowder software / com
 www.crowdersoftware.com

 On Aug 16, 10:00 pm, Phil Petree phil.pet...@gmail.com wrote:
  I've looked everywhere for a solution to this and hacked around with it
 all
  day with no luck.
 
  How do we populate a select box using xml data obtained from an ajax
  request.
 
  If what I get back from the fillin example is this:
  data
  firstJack/first
  lastFlash/last
  emailjfl...@candlestick.com/email
   /data
 
  And I want to add a list of US states to a select box but obviously we
 can't
  have
 
  stateAK/state
  stateAL/state
 
  So question 1 is: What's the correct format for the XML response?
 
  My 2nd question is how do I break out the seperate parts from the
 transport
  response?
 
 transport.responseXML.getElementsByTagName('$fieldname')[0].firstChild.node
 Value;
 
   My 3rd question is, will the following code work for populating the
 select
  box?
  opt.text = Alaska;
  opt.value = AK;
  $(DropDownStateList).options.add(opt);// Assign
  text and value to Option object

 --
 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
 prototype-scriptacul...@googlegroups.com.
 To unsubscribe from this group, send email to
 prototype-scriptaculous+unsubscr...@googlegroups.comprototype-scriptaculous%2bunsubscr...@googlegroups.com
 .
 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 prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to 
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en.



Re: [Proto-Scripty] Re: prototype to populate select box via ajax

2010-08-17 Thread Phil Petree
Here is a completed function that will populate a select box with data in an
XML format (XML format below):

// fill the select dropdown list box
// @ajax response (transport as returned above)
// @id of the select field (defaults to elFieldName
// @xml_data_node_name (our dataset uses 'state')
function fillSelectList(transport, select_id, xml_data_node)
{
  var states,
  state,
  selbox,
  options;
  // Get  validate response
  states = transport.responseXML.getElementsByTagName(xml_data_node);

  $(select_id).options.length = 1;
  for(var i = 0; i  states.length; i++)
  {
var value = states[i].getAttribute('value');
var name= states[i].getAttribute('name');
// i+1 allows us to skip over the first item in the
// pulldown which prompts the user to Pick One
$(select_id).options[i+1] = new Option(name, value, null, false);
  }
}

XML Data
data
  firstJohn/first
  lastDoe/last
  emailj...@gmail.com/email
  states
  state value=AL name=Alabama /
  state value=GA name=Georgia /
  state value=FL name=Florida /
  state value=CA name=California /
  /states
/data

 Thanks to T.J. and Colin Mollenhour for their help on this!

-- 
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 prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to 
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en.