Page 1 of 2

How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Thu May 13, 2010 2:54 pm
by vilkis
Hi,
Since CMSMS 1.7.1 class is being added to  input tag, for example for textfield class="cms_textfield" is being added. I need to add the module specific class. How can I do it?

vilkis

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Thu May 13, 2010 3:17 pm
by vilkis
Ok. One of the ways could be:

Code: Select all

str_replace('class="cms_textfield"', 'class="cms_textfield MY_CLASS"', $this->CreateInputText(....)
vilkis

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Thu May 13, 2010 3:30 pm
by calguy1000
Yeah, you can do that.  but with wrapper divs you shouldn't need to.
Jquery and css selectors make having to add classes to specific text fields almost un-necessary.
we added the classes there so that things would be easier to style.

i.e: 

{FrontEndUsers}



jQuery(document.ready(function(){
  jQuery('#loginform.cms_textfield').addClass('myclass');
});


easy stuff.

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Thu May 13, 2010 3:59 pm
by vilkis
It is nice feature for styling as not all browsers support "[type=text]" in css. Using Javascript is also good, but imagine that one wants to  create site that does not need javascript in frontend? Or let say module creates several textfields and one of them should have one class and other one - other. What to do? One has to create additional smarty array of parameters?

Anyway, thank you for the tip.

vilkis

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Wed Aug 18, 2010 9:07 am
by manmower
I hope it's okay to reply to this (somewhat) old topic...

In a module a made some time ago I used jquery to validate my selfmade frontend forms... To create a mandatory form field I used

Code: Select all

$this->CreateInputText($id, 'name', '', 10, 255, 'class="mandatory"');
on the frontend I used jquery to validate a fields with the mandatory class.
since CMSMS 1.7.1 this doesn't work anymore because the tag now looks like

Code: Select all

<input type="text" name="id_name" id="id_name" class="cms_textfield" size="10" maxlength="255" class="mandatory" />
Does anybody have a solution for this problem? I don't think str_replace is a very good/clean solution for this problem...

I don't know why the decision is made to add a class to every input field... I think we've now lost a little bit of freedom in module making. I think you should be able to add classes to individual input fields. Is it an option to extend the CreateInput* functions with a addclass? (I know... probably asking a bit too much here...)

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Wed Aug 18, 2010 4:38 pm
by vilkis
In this situation to use str_replace is the best way. I agree it is strange to generate some string and then replace part of it.
Actually, if you generate a Qjuery code with your module you can do so that a Qjuery recognizes input field by id.

vilkis

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Wed Aug 25, 2010 2:26 pm
by markS
Hello,

I've just been bitten by this problem today.  I've just upgraded a site from 1.6.x to 1.8.2 and now all the styling on custom forms within the modules I have created have gone haywire! :(

If the developers of cmsmadesimple are going to force classes and styles upon certain html elements then they also need to supply a way of overriding those styles, imho.  I consider this move to be quite an unnecessary restriction, it makes me not want to use the provided api functions to create my form elements and no one wants that.

It is all well and good for new sites, where we can code within the restrictions, but for sites that have been around for a while it makes it very difficult for me to sell the upgrade...

Anyway, I have a suggestion for manmower, as you're already using jquery within the page this might be the best place to tackle the issue and use jquery itself to add a class to the fields when the page loads.  Something like:

$('.cms_textfield').addClass('mandatory');

I suppose that would have the effect of flagging all the fields with that class as 'mandatory', maybe not quite what you want, but with some thought you'll probably get what you want without having to rewrite all the forms or the scripts that generate them.

Cheers,

          Mark.

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Sat Sep 04, 2010 1:46 am
by NaN
IMHO there should be an additional param in the api functions that creates the form inputs to add a custom class attribute.
E.g.

$this->CreateInputText($id, 'name', '', 10, 255, '', 'mandatory foo');

what would result in



What do you devs think of that?

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Thu Oct 07, 2010 9:45 pm
by kidcardboard
NaN wrote:
IMHO there should be an additional param in the api functions that creates the form inputs to add a custom class attribute.
E.g.

$this->CreateInputText($id, 'name', '', 10, 255, '', 'mandatory foo');

what would result in



What do you devs think of that?
I couldn't have said it better myself

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Fri Oct 08, 2010 2:20 am
by Dr.CSS
You can't add classes to the form inputs or other elements when creating/editing them anymore?...

Re: How to add the module specific class to input tag? CMSMS 1.7.1

Posted: Fri Oct 08, 2010 3:10 pm
by kidcardboard
Dr.CSS wrote: You can't add classes to the form inputs or other elements when creating/editing them anymore?...
Some elements you can, and some you can't. Links are the only element I've come across so far where adding a class to it actually works.

Re: How to add the module specific class to input tag? CMSMS

Posted: Sun Jan 30, 2011 4:20 pm
by Duketown
[edit]Dr.CSS explains in a later post an answer to this situation. I have removed the code shown in this post. Better if you use DR.CSS's method.[/edit]
I see more people (read developers) seem to have to cope with this situation.
The api description of CreateInputText (at this moment core 1.9.2 is out) seems still to refer to the pre cms_textfield times. The way I solved it is by far from the best method, but it works.
I used in the main module program (ie skeleton.module.php) a copy of the function that prepares the input text field:

Code: Select all

	/**
	 * Rewrite of cms_module_CreateInputText() in modform.inc.php
	 * Core program has class defined 'cms_textfield' that doesn't allow further design with a class
	 */
	function CreateInputText($id, $name, $value='', $size='10', $maxlength='255', $addttext='')
	{
		$value = cms_htmlentities($value);
		$id = cms_htmlentities($id);
		$name = cms_htmlentities($name);
		$size = cms_htmlentities($size);
		$maxlength = cms_htmlentities($maxlength);
		
		$value = str_replace('"', '"', $value);
		
		$text = '<input type="text" name="'.$id.$name.'" id="'.$id.$name.'" value="'.$value.'" size="'.$size.'" maxlength="'.$maxlength.'"';
		if ($addttext != '')
		{
			$text .= ' ' . $addttext;
		}
		else {
			// No additional data, at least set the default class to cms_field
			$text .= ' class="cms_textfield"';
		}
		$text .= " />\n";
		return $text;
	}
In the program that creates the input text field I now have:

Code: Select all

$this->CreateInputText($id, 'name', $name, 40, 60, 'class="cms_textfield required"'));
This allows me to exactly set the class or additional text that I want to, while not passing the 'class=...' gives the default cms_textfield.
I know it overrides the default core version, but this seems to me a stable function anyway.

Duketown

Re: How to add the module specific class to input tag? CMSMS

Posted: Sun Jan 30, 2011 4:41 pm
by Dr.CSS
I add classes to forms all the time, it may put them on the div around the input or whatever it is but it is still very useful to me...

Re: How to add the module specific class to input tag? CMSMS

Posted: Sun Jan 30, 2011 10:03 pm
by Duketown
Dr.CSS,

A div around the input. I do understand how to do that, but how do I change the background color (for example) of the input field with a div around it, since the cms_textfield overrides it (I don't want to have all input fields with the same background color. Required input fields should have a different color than non required.

Duketown

Re: How to add the module specific class to input tag? CMSMS

Posted: Sun Jan 30, 2011 11:43 pm
by Dr.CSS
Like so...

div.required input {background-color:#f2f2f2}

If I see the site it helps tell more of what can be done, that up there is just the tip of what can be done...