Just starting out? Need help? Post your questions and find answers here.
User avatar
Alexi
 
Posts: 4
Joined: Tue Feb 25, 2014 6:56 pm

Gadget Element

by Alexi Sat Apr 12, 2014 3:40 pm

How can i get the div element of an gadget for js? Actually a findElementByID can't work for all gadgets as some of them doesnt store an ID. GadgetID() in some way?
User avatar
eddy
 
Posts: 124
Joined: Thu Mar 27, 2014 8:34 am

Re: Gadget Element

by eddy Sat Apr 12, 2014 4:06 pm

I don't know if all SB gadgets are DIV-based gadget.

Code: Select all
Procedure.i GadgetElement(Gadget, UseJquery.b=#True)
  Protected gadgetObject=GadgetID(Gadget)
  !if (v_gadgetObject && v_gadgetObject.div) { return v_UseJquery? $(v_gadgetObject.div):v_gadgetObject.div; }
EndProcedure
User avatar
Alexi
 
Posts: 4
Joined: Tue Feb 25, 2014 6:56 pm

Re: Gadget Element

by Alexi Sat Apr 12, 2014 6:01 pm

Thank you eddy, but is that the object to access like this?

Code: Select all
! myDiv.style.color = 'red';
User avatar
eddy
 
Posts: 124
Joined: Thu Mar 27, 2014 8:34 am

Re: Gadget Element

by eddy Sat Apr 12, 2014 6:34 pm

like that:

Code: Select all
#Window = 0


Procedure.i GadgetElement(Gadget, UseJquery.b=#True)
  Protected gadgetObject=GadgetID(Gadget)
  !if (v_gadgetObject && v_gadgetObject.div) { return v_UseJquery? $(v_gadgetObject.div):v_gadgetObject.div; }
EndProcedure

OpenWindow(#Window, 0, 0, 0, 0, "noty", #PB_Window_Background)
ButtonGadget(1, 10, 10, 100, 30, "OK")
ButtonGadget(2, 10, 40, 100, 30, "RUN")

;***** change button background color ********

buttonDIV=GadgetElement(1,#False)
!v_buttonDIV.firstChild.firstChild.style.backgroundColor='red';   // using DOM properties

buttonJquery=GadgetElement(2,#True)
!v_buttonJquery.find('.dijitButtonNode').css({'backgroundColor':'red'}); // using Jquery methods
Last edited by eddy on Sat Apr 12, 2014 6:52 pm, edited 4 times in total.
User avatar
Peter
 
Posts: 497
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1

Re: Gadget Element

by Peter Sat Apr 12, 2014 6:36 pm

Alexi wrote:Thank you eddy, but is that the object to access like this?

Code: Select all
! myDiv.style.color = 'red';


ButtonGadgets (for example) consist of several divs and spans.

Code: Select all
<div style="position: absolute; left: 10px; top: 10px; width: 100px; height: 30px;">
   <span class="dijit dijitReset dijitInline dijitButton" role="presentation" widgetid="dijit_form_Button_0">
      <span class="dijitReset dijitInline dijitButtonNode" data-dojo-attach-event="ondijitclick:__onClick" role="presentation">
         <span class="dijitReset dijitStretch dijitButtonContents" data-dojo-attach-point="titleNode,focusNode" role="button" aria-labelledby="dijit_form_Button_0_label" tabindex="0" id="dijit_form_Button_0" style="-webkit-user-select: none; width: 98px; height: 28px;">
         <span class="dijitReset dijitInline dijitIcon dijitNoIcon" data-dojo-attach-point="iconNode">
         </span>
         <span class="dijitReset dijitToggleButtonIconChar">●</span>
            <span class="dijitReset dijitInline dijitButtonText" id="dijit_form_Button_0_label" data-dojo-attach-point="containerNode" style="display: table-cell; width: 98px; height: 28px; color: red;">Button1</span>
         </span>
      </span>
      <input type="button" value="" class="dijitOffScreen" data-dojo-attach-event="onclick:_onClick" tabindex="-1" role="presentation" data-dojo-attach-point="valueNode">
   </span>
</div>


If you want to color the buttontext, you have to look at a span with class "dijitButtonText":

Code: Select all
Procedure.i GadgetElement(Gadget, UseJquery.b=#True)
  Protected gadgetObject=GadgetID(Gadget)
  !if (v_gadgetObject && v_gadgetObject.div) { return v_UseJquery? $(v_gadgetObject.div):v_gadgetObject.div; }
EndProcedure

OpenWindow(0, 10, 10, 300, 300, "")

ButtonGadget(0, 10, 10, 100, 30, "Button1")
ButtonGadget(1, 10, 50, 100, 30, "Button2")

GE1 = GadgetElement(0,#True)
GE2 = GadgetElement(1,#True)

! v_GE1.find(".dijitButtonText").css("color", "red");
! v_GE2.find(".dijitButtonText").css("color", "blue");


Greetings ... Peter
Return to Coding Questions

Who is online

Users browsing this forum: No registered users and 1 guest