[SOLVED] I want to add CSS to the select box of Time Origination to make it slick.

That bit of code uses the native smarty "html_select_date" function and for some reason, it doesn't have an "id" param. Not sure about smarty 3 but it doesn't in smarty 2.

Best bet is to try to use JS to shim the id in.

Not tested but try changing ...

  {if !empty($ItemEditItem.originationTimestamp)}
  <script type="text/javascript">
  // <![CDATA[

to ...

  {if !empty($ItemEditItem.originationTimestamp)}
  <script type="text/javascript">
	var obj;
	var elemArr = new Array();
	var nameArr = new Array(
			"g2_form[originationTimestampSplit][Date_Year]",
			"g2_form[originationTimestampSplit][Date_Month]",
			"g2_form[originationTimestampSplit][Date_Day]",
			"g2_form[originationTimestampSplit][Time_Hour]",
			"g2_form[originationTimestampSplit][Time_Minute]",
			"g2_form[originationTimestampSplit][Time_Second]"
	);
	for (var j = 0; j < 6; j++) {ldelim}
		elemArr = document.getElementsByName(nameArr[j]);
		for (var i = 0; i < elemArr.length; i++) {ldelim}
			obj = document.getElementsByName(nameArr[j]).item(i);
			obj.class = "CLASSNAME";
		{rdelim}
	{rdelim}
  // <![CDATA[

** EDIT **
Checked the actual G2 source

You will be better off using a single CSS class for all the drop downs (".CLASSNAME" instead of "#CLASSNAME" in your css file)

Modified the code above. Note change in area where edits start.

If you do want ids for some reason, that should give you a jump off point to complete it but remember that each id has to be unique on a page.

--
dakanji.com

No reason why it shouldn't really.

Post the html source from your browser (using "View Source" or similar) of the select boxes and let's have a look.

Also, what id, probably better as a class actually, do you want to assign to the select boxes?

--
dakanji.com

I tried all the solutions above. Still not getting class on those select boxes. I was hoping to use this jquery script but I need to have classes for it work. http://www.bulgaria-web-developers.com/projects/javascript/selectbox/

If this can't be figured out I did come across an alternative albeit is not as pretty as jquery would have made the select boxes though. Since g2 does name the form select boxes... g2_form[originationTimestampSplit][Date_Month],g2_form[originationTimestampSplit][Date_Day], etc.

I have figured out I can direct CSS to the attribute "name" using...

<style type="text/css">

select[name="g2_form[originationTimestampSplit][Date_Month]"] {
    background:url(http://imgur.com/MJyZM.png) 0 0 no-repeat;
    -webkit-appearance: none;
    border: solid 1px #515151;
    font-family: Arial, sans-serif;
    font-size: 18px;
    font-weight: normal;
    height: 30px;
    position: relative;
    width: 170px;
    overflow:hidden;
}

select[name="g2_form[originationTimestampSplit][Date_Day]"] {
    background:url(http://imgur.com/MJyZM.png) 0 0 no-repeat;
    -webkit-appearance: none;
    border: solid 1px #515151;
    font-family: Arial, sans-serif;
    font-size: 18px;
    font-weight: normal;
    height: 30px;
    position: relative;
    width: 170px;
    overflow:hidden;
}

</style>

thanks for your help Dayo and suprsidr.

very much appreciated.