Ajax Help

[[email protected]]

Hi All

I have been playing around with the Ajax I have taken the Cascading drop downs. and have amended for my own use

On the hidden form that appears when the lastname is selected I have the following code

</tr></tr><!--Service-->
	<tr>
<td class="CorporateColumnTD">
<label id="CMP2_service.L" for="CMP2_service" >Service</label>
</td>
<td  class="CorporateDataTD" >
<%a5 ?SERVICEList%>
<input	
 id="CMP2_service" size="0" class="CorporateInput" 
      name="V.service">
<span 	
 class    
="CorporateErrorDataTD" style="BORDER-RIGHT: medium none; BORDER-TOP: medium none; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-LEFT: medium none; BORDER-BOTTOM: medium none" 
      id="CMP2_service.ERRORMSG" 
     >

as you can see I have another drop down list servicelist, the value that get written to the table is V.service.

How do I assign the value of my servicelist to v.service or to put it another way how do put a list into the CMP2_service field.

Andy

[NoeticCC]

Re: Ajax Help

The WAS tutorials have the syntax for all of these, at least the interactive tutorial does: http://www.charlesworth.biz/WAS/AJAX...veTutorial.a5w (You have to click on "Click here" to open the explanations... easy to miss, I did that a fair few times even AFTER I figured out how to get to it!)

[[email protected]]

Re: Ajax Help

Hi Andrea

I assume I have to put this code into the JS script


a5_AJAX_Form_populateSelect('CMP2_STATE','ND',true,'GF\n8:AM\n9:AM\n10:AM');

is that correct ?

And would you be kind enough to tell me how to do that as I have never done JS before

Andy

[NoeticCC]

Re: Ajax Help

Hi Andrea

I assume I have to put this code into the JS script


a5_AJAX_Form_populateSelect('CMP2_STATE','ND',true,'GF\n8:AM\n9:AM\n10:AM');

is that correct ?

And would you be kind enough to tell me how to do that as I have never done JS before

Andy

No if I am not mistaken (very possible...), you can put it in the Ajax callback page just like in the other examples you tried. E.g.

?"a5_AJAX_Form_populateSelect('CMP2_STATE','ND',true,'GF\n8:AM\n9:AM\n10:AM');"

Have a look at the two sample files (the Ajax and normal a5w page) for the interactive tutorial, it should be clearer from there (I hope!).

It IS Javascript, but because AJAX responds to the calling page in Javascript, you can generate the response in Xbasic, from the AJAX.a5w page you use in your callback.

[[email protected]]

Re: Ajax Help

Hi Andrea,

Still struggling with this one, here is my code below where would I place the line

?"a5_AJAX_Form_populateSelect('CMP2_service','ND',true,'GF\n8:AM\n9:AM\n10:AM');"

Andy

<%a5


Response.charset = "ISO-8859-1"	''set the charset of the response to ISO-8859-1

dim dbf_folder as c 
dbf_folder = _A5_Aliases.get("PathAlias.ADB_Path")
DIM tablename as c 
tablename = a5_removetrailingbackslash(dbf_folder) + chr(92) + "SUN.dbf"
DIM tablename2 as c 
tablename2 = a5_removetrailingbackslash(dbf_folder) + chr(92) + "INPUTCONS.dbf"
dim action as c = default ""

dim __formAction as c = default ""


if action = "StateChanged" then 
	onStateChanged(local_variables())
else if action = "CityChanged" then 
	onCityChanged(local_variables())
else if action = "LastnameChanged" then 
	onLastnameChanged(local_variables())
else if __Formaction = "Submit" then 
	dim flag as l
	flag = doValidate(local_variables())
	if flag then 
		doSaveChanges(local_variables())
	end if 
	
end if 


function doValidate as l (vars as p)
with vars 

dim errorText as c = ""
if v.customer_ID = "" then 
	errorText = errorText + "Customer_ID cannot be blank." + crlf()
end if

if v.firstname = "" then 
	errorText = errorText + "Firstname cannot be blank." + crlf()
end if 

if v.lastname = "" then 
	errorText = errorText + "Lastname cannot be blank." + crlf()
end if 

if errorText = "" then
	doValidate = .t.
else
	doValidate = .f.
	errorText = "Record was not saved. Your form has errors:" + crlf() + errorText
	?"alert('" + JSStringEncode(errorText) +  "');"

end if 



end with 
end function 

function dosaveChanges as v (vars as p)
with vars 



''In case a previous attempt to save generated an error, first clear any error messages.
?"$('COMP2_ERRORS').innerHTML = '';"

dim tbl as p 
tbl = table.open(tablename)
tbl.change_begin()
tbl.NAME = V.Customer_id
tbl.ADDRESS_ONE = V.Firstname
tbl.ADDRESS_TWO = V.Lastname
tbl.TOWN = V.Company
tbl.COUNTY = V.Phone
tbl.POST = V.POST

tbl.change_end(.t.)
tbl.close()
dim tbl1 as p
Tbl1 = table.open(tablename2)
myitems = convert_type(V.items,"n")
mywgt = convert_type(V.wgt,"n")
'session.account = "de00001"
tbl1.enter_begin(.t.)
tbl1.conno= V.curval
tbl1.acno = session.account
tbl1.prod = V.service
tbl1.cdate = date()
tbl1.cename = V.customer
tbl1.address_one = V.street_one
tbl1.address_two = V.street_two
tbl1.town = V.town
tbl1.county = V.county
tbl1.post = V.post_code
tbl1.items = V.myitems
tbl1.type = V.type
tbl1.wgt = V.mywgt
tbl1.instructions = V.special_intsructions
tbl1.tail_lift = V.tail_lift
tbl1.hazarduos = V.hazardous
tbl1.bookin = V.book_in
tbl1.refno = V.reference
tbl1.refno_two = V.reference_two
tbl1.account = V.custacc
tbl1.enter_end(.t.)


?"alert('Your changes were saved. ');"
end

errorOnUpdate: 

?"alert('"+JSStringEncode("Changes not saved because there was an error: " + crlf() + error_text_get()) +"');"

end with 
end function 


function OnStateChanged as v (vars as p)
with vars

dim cityList as c 
cityList = table.external_record_content_get(tablename,"alltrim(town)","Town","name = "+s_quote(state)+" .and. unique_key_value()")

cityList = alltrim(cityList) ''remove any blanks from the list
cityList = "Select city" + crlf() + cityList
cityList = a5_html_list_populate(cityList,"Select city")
cityList = "<select name=\"City\" id=\"COMP1_CITY\"   onchange=\"onCityChanged()\">" + cityList + "</select>"
?"$('COMP1_CITY_SELECT_CONTAINER').innerHTML = '" + JSStringEncode(cityList) + "';"


lastnameList = a5_html_list_populate("Select a city","Select a city")
lastnameList = "<select name=\"Lastname\" id=\"COMP1_LASTNAME\" onchange=\"onLastnameChanged()\">" + lastnameList + "</select>"
?"$('COMP1_LASTNAME_SELECT_CONTAINER').innerHTML = '" + JSStringEncode(lastnameList) + "';"

''Turn oFf the details form
?"$('COMP2_DETAILS').style.display = 'none';"


end with 
end function 


function OnCityChanged as v (vars as p)
with vars


dim lastnameList as c 

lastnameList = table.external_record_content_get(tablename,"''+recno()+'|'+alltrim(post) ","post","name = "+s_quote(state)+" .and. town = "+s_quote(city) + " .and. unique_key_value()")

lastnameList = alltrim(lastnameList) 'remove any blank from the list
lastnameList = "Select a customer" + crlf() + lastnameList
lastnameList = a5_html_list_populate(lastnameList,"Select a customer")

lastnameList = "<select name=\"Lastname, firstname\" id=\"COMP1_LASTNAME\" onchange=\"onLastnameChanged()\">" + lastnameList + "</select>"
?"$('COMP1_LASTNAME_SELECT_CONTAINER').innerHTML = '" + JSStringEncode(lastnameList) + "';"


'Turn off the details form
?"$('COMP2_DETAILS').style.display = 'none';"




end with 
end function 


function onLastnameChanged as v (vars as p)
with vars 

''lastname' (the value submitted when the user makes a selection from the lastname dropdown) is actually
'the record number of the selected record.

dim tbl as p 
tbl = table.open(tablename)
tbl.fetch_goto(val(lastname))

?"$('CMP2_CUSTOMER_ID').value = '"  + alltrim(tbl.NAME)+"';"
?"$('CMP2_FIRSTNAME').value = '"  + alltrim(tbl.ADDRESS_ONE)+"';"
?"$('CMP2_LASTNAME').value = '"  + alltrim(tbl.ADDRESS_TWO)+"';"
?"$('CMP2_COMPANY').value = '"  + alltrim(tbl.TOWN)+"';"
?"$('CMP2_PHONE').value = '"  + alltrim(tbl.COUNTY)+"';"
?"$('CMP2_POST').value = '"  + alltrim(tbl.POST)+"';"
?"$('CMP2_items').value = '" "';"
?"$('CMP2_Type').value = '""';"
?"$('CMP2_wgt').value = '" "';"
?"$('CMP2_tail_lift').value = '""';"
?"$('CMP2_Bookin').value = '" "';"
?"$('CMP2_Reference').value = '""';"
?"$('CMP2_Reference_two').value = '" "';"

tbl.close()


''Turn on the display of the detail form.
?"$('COMP2_DETAILS').style.display ='block';"

?"a5_AJAX_FormPrepare('CMP2.FORM');"




end with 
end function 







function JSEncode as c (txt as c )
	JSEncode = stritran(txt,crlf(),"<br />")
	JSEncode = stritran(JSENcode,"'","\'")
end function 

function JSStringEncode as c (txt as c )
	JSStringEncode = stritran(txt,crlf(),"\n")
	JSStringEncode = stritran(JSStringEncode,chr(10),"\n")
	JSStringEncode = stritran(JSStringEncode,chr(13),"\n")
	JSStringEncode = stritran(JSStringEncode,"'","\'")
end function 

%>

[NoeticCC]

Re: Ajax Help

I just had a look, to generate the whole list dropdown, the CASCADING sample uses the Alpha 5 function a5_html_list_populate() and re-writes the whole contents of the cell that the dropdown is in, rather than just manipulating the existing <select>.

I am attaching a hopefully simple sample, can also be seen here: http://www.charlesworth.biz/WAS/AJAX_ServiceTest.a5w

[NoeticCC]

Re: Ajax Help

Added another variant now, using the Javascript a5_AJAX_Form_populateSelect() function in the AJAX.a5w page: http://www.charlesworth.biz/WAS/AJAX_ServiceAlt.a5w

[[email protected]]

Re: Ajax Help

Hi Andrea,

Thanks for your examples, but that not quite what I am after.

If you take a look at my page

http://www.alphasoftwareuk.com/Consignment_ajax_dbf.a5w

You will see that I can assign a drop down list to my form the service field, But when I write the consignment away to the table I will write the value of the box next to it. the value of that box is V.service = tbl1.prod = V.service.

Now as far as I can see from the HTML code

</tr></tr><!--Service-->
<tr>
<td class="CorporateColumnTD">
<label id="CMP2_service.L" for="CMP2_service" >Service</label>
<%a5 ?serviceList%>
</td>
<td  class="CorporateDataTD" >
<input	
								 id="CMP2_service" size="0" class="CorporateInput" 
      name="V.service">

Now from the code above will servicelist be assigned to V.service

I hope this makes sense

Andy

[NoeticCC]

Re: Ajax Help

Hi Andrea,

Thanks for your examples, but that not quite what I am after.

Aaah... I thought you asked how to get the list of values into the dropdown box - is it the other way around? E.g. you want to know how to address a dropdown to find out its selected value?

This is simply: $('nameofcontrol').value

If you look at the Javascript in the CascadingDropdowns a5w page, the function called in the onchange event of each dropdown box passes the value to the AJAX page like this:

function onStateChanged ()
{

a5_AJAX_Callback('AJAX_CascadingDropDowns_DBF.Ajax.A5W','action=stateChanged[COLOR="Red"]&state='+urlencode($('COMP1_STATE').value) [/COLOR]);
}

Just replace COMP1_STATE with whatever the name of your dropdown is that you want to filter by...

Then in the AJAX page for the cascading dd samples, the Xbasic code there just uses the state variable passed in, in order to select the relevant records from the database (red) and generates the new, filtered dropdown (blue):

dim cityList as c 
cityList = table.external_record_content_get(tablename,"alltrim(bill_city)","bill_city","bill_state_region = "+s_quote([COLOR="red"]state[/COLOR])+" .and. unique_key_value()")

[COLOR="RoyalBlue"]cityList = alltrim(cityList) ''remove any blanks from the list
cityList = "Select city" + crlf() + cityList
cityList = a5_html_list_populate(cityList,"Select city")
cityList = "<select name=\"City\" id=\"COMP1_CITY\"   onchange=\"onCityChanged()\">" + cityList + "</select>"
?"$('COMP1_CITY_SELECT_CONTAINER').innerHTML = '" + JSStringEncode(cityList) + "';"[/COLOR]