unable to update DIV code programatically

[JPMPA]

I have a Alpha Free-form container on a panel, where I added the following HTML (free form Layout)

<div id="my_div1" style="width:900px">
<h3>This is a test</h3>
<p>This is also a text</p>
</div>

It looked good.

Now using a button and AJAX call to the server I would like to update the DIV my_div1 to the following
<h3>Testing 123</h3> <p>also testing 123</p>

So on the AJAX server code I used the following

function serverside_41c20342cb5c4f0ab66a7884543g as c (e as p)
e._setElement.MY_DIV1.value = "<h3>Testing 123</h3> <p>also testing 123</p>"
end function

But, the button code is not updating the panel with the html value. What am I doing wrong? Help.

[-Jinx-]

Re: unable to update DIV code programatically

I know this works as javascript to return from your xbasic:

jvsToSendBack = "$('my_div1').innerHTML='<h3>Testing 123</h3> <p>also testing 123</p>';"

I've never used what you are using (e._setElement) but I'll look into it.

[-Jinx-]

Re: unable to update DIV code programatically

Yeah, I can't get that e._setElement to work either. I made a quick dialog and called my function UpdateDiv. In my function I put the below code in and did an ajax callback from a button. it worked fine:

function UpdateDiv as c (e as p)

dim jvsToSendBack as c = "$('my_div1').innerHTML='<h3>Testing 123</h3> <p>also testing 123</p>';"

UpdateDiv = jvsToSendBack

end function

[JPMPA]

Re: unable to update DIV code programatically

Thanks AH it worked with JavaScript.
I was using _setElement.DIV1 based on the Alpha documentation (when you create a AJAX call, you see a bunch of commented text/code that Alpha automatically added to the function before the end function - for our handy reference - it was mentioned there)

'Note:
'In addition to 'e._set', you can set properties of the 'e._setElement' object.
'Examples:
'e._setElement.DIV1.value = "Some text" --- sets the innerHTML of DIV with the id of 'DIV1'
'e._setElement.SPN2.style.color = "Red" ---- sets style properties of a SPAN with id of 'SPN2'

Thanks!

[JPMPA]

Re: unable to update DIV code programatically

Thanks!

[TheSmitchell]

Re: unable to update DIV code programatically

Thanks AH it worked with JavaScript.
I was using _setElement.DIV1 based on the Alpha documentation (when you create a AJAX call, you see a bunch of commented text/code that Alpha automatically added to the function before the end function - for our handy reference - it was mentioned there)

'Note:
'In addition to 'e._set', you can set properties of the 'e._setElement' object.
'Examples:
'e._setElement.DIV1.value = "Some text" --- sets the innerHTML of DIV with the id of 'DIV1'
'e._setElement.SPN2.style.color = "Red" ---- sets style properties of a SPAN with id of 'SPN2'

Thanks!

Just speculating here. Does it work if you change your id from "my_div1" to "MY_DIV1"? JavaScript is case sensitive. I am wondering if the xbasic is expecting you to use all caps for your id's if you want to use the _setElement property....

[-Jinx-]

Re: unable to update DIV code programatically

Just speculating here. Does it work if you change your id from "my_div1" to "MY_DIV1"? JavaScript is case sensitive. I am wondering if the xbasic is expecting you to use all caps for your id's if you want to use the _setElement property....

I tried it both ways in terms of capitalization and camelcase and I just couldn't get it to work at all with e._setElement.

Could you give it a try with something simple Sarah and see if you can get it to work?

[TheSmitchell]

Re: unable to update DIV code programatically

I tried it both ways in terms of capitalization and camelcase and I just couldn't get it to work at all with e._setElement.

Could you give it a try with something simple Sarah and see if you can get it to work?

Your div id must be all caps. This is the line returned from the AWS for _setElement:

$svs('MY_DIV1',('<h3>Testing 123</h3> <p>also testing 123</p>'));

You can view the code generated by debugging in Live Preview (not Working Preview). Put a debug(1) statement in your xbasic code and then clicking the "step" button until you are in a place that looks a lot like this:

analyzingAjaxResponse.png

Look at x_out.A_AjaxResponses. One of these will contain JavaScript that was generated by your callback. In this particular example, it was the second entry in A_AjaxResponses.

Or, you can look at the POST value returned in the browser using FireBug or some debugging tool.

Ids are case sensitive, so there is no div with the id "MY_DIV1". If you change your div id from "my_div1" to "MY_DIV1", it works just fine.

[-Jinx-]

Re: unable to update DIV code programatically

I could have swore that I tried that as I know it's case sensitive but your component works fine for me so I must have missed it. Thanks Sarah.

[JPMPA]

Re: unable to update DIV code programatically

Awesome! I am going to test soon. Thank you!!

[JPMPA]

Re: unable to update DIV code programatically

It worked. Thanks AH and Sarah!!!