Triggering component event from raw text HTML element -- Answered

[mdomke]

Is there a way to trigger an IWControl event from a HTML element created in raw text?

For example, if I create a series of HTML elements, for example anchor tags <a>, using the raw text mode of an IWText component, can I hook the onClick event of that HTML element to an onClick event defined in an IWForm, or the WebApplication for that matter?

I'm trying to create a visually unique navigation and the only way I found I can do this is by using the raw text mode of the IW Text component. I need the HTML elements within the raw text to be interactive and I need that interaction to be managed by the WebApplication session, for example, navigating to another page.

I hope this makes and any insight and especially code examples would be much appreciated.

Many thanks,
Michael

[Jose Nilton Pace]

Hi Michael, YES, you can.

Code:

<a href="#" onclick="return SubmitClick('IWBUTTON1','optional_parameter', false);"><i class="fa fa-calendar fa-fw" aria-hidden="true"></i><span>Agenda</span></a>

[joel]

Hi Michael, YES, you can.

Code:

<a href="#" onclick="return SubmitClick('IWBUTTON1','optional_parameter', false);"><i class="fa fa-calendar fa-fw" aria-hidden="true"></i><span>Agenda</span></a>

You can also register a call back 

  WebApplication.RegisterCallBack('fxGridEditCallBack', fxGridEditCallBack);

then in the html do something like this for an ajax call or use the submitclick example above for the non ajax call

            lJS.Add('     var paramlist = "&edittype=0&Agid="+options.gid+"&ArowId="+options.rowId;');
            lJS.Add('     var clk = "executeAjaxEvent(''"+paramlist+"'',null,''fxGridEditCallBack'',true,null,true)";');
            lJS.Add('     return "<a onclick = \"" + clk + "\" href=''#''><img title=''Edit'' src=''/files/Images/default/edit.png''></a>";');

[mdomke]

Hi Michael, YES, you can.

Code:

<a href="#" onclick="return SubmitClick('IWBUTTON1','optional_parameter', false);"><i class="fa fa-calendar fa-fw" aria-hidden="true"></i><span>Agenda</span></a>

This worked perfectly. Thank you so much!

Michael

[DanielFields]

Please explain a bit more. Does that code display a calendar that calls SubmitClick() on every click?

[Jose Nilton Pace]

Hi Daniel, YES, exactly this. A clickable calendar image from fontAwesome, check it here.