NiceForms

[pSouper]

hey all,
I am currently developing a site where we have integrated niceForms by emblematiq
unfortunately it does currently involve a small hack to the "forms content part" core file > includes/inc_front/content/cnt23.article.inc.php
This is so we can introduce the form class in the form element rather than as the class of the container <div>

Here goes.. download the package form here then...

Upload the various files to the relevant folders (as per the zip structure)
Add the following to your template 'html head' area...

Code: Select all

<script type="text/javascript" src="template/inc_js/niceForms.js"></script>

Add the following to your template 'CSS file' area...

Code: Select all

niceForms.css

Edit your forms content part to use the form class "niceform"

...Now for the code changes...
Edit your core file includes/inc_front/content/cnt23.article.inc.php as follows...

Find...

Code: Select all

if($form_cnt) {
	$form_cnt = str_replace('###RESET###', '', $form_cnt);
	$cnt_form["class_close"] = '';
	if($cnt_form["class"]) {
		$CNT_TMP .= '<div class="'.$cnt_form["class"].'">';
		$cnt_form["class_close"] = '</div>';
	}
	$CNT_TMP .= $form_error_text;
	$CNT_TMP .= '<form name="phpwcmsForm'.$crow["acontent_id"].'" id="phpwcmsForm'.$crow["acontent_id"].'" class="niceform" ';
	$CNT_TMP .= 'action="'.FE_CURRENT_URL.'#jumpForm'.$crow["acontent_id"].'" method="post" enctype="multipart/form-data">';

Change to...

Code: Select all

if($form_cnt) {
if($form_cnt) {
	$form_cnt = str_replace('###RESET###', '', $form_cnt);
	$cnt_form["class_close"] = '';
	if($cnt_form["class"]) {
		$CNT_TMP .= '<div class="'.$cnt_form["class"].'">';
		$cnt_form["class_close"] = '</div>';
		$class=' class="'.$cnt_form["class"].'" ';
	}else {$class="";}
	$CNT_TMP .= $form_error_text;
	$CNT_TMP .= '<form name="phpwcmsForm'.$crow["acontent_id"].'" id="phpwcmsForm'.$crow["acontent_id"].'" '.$class;
	$CNT_TMP .= 'action="'.FE_CURRENT_URL.'#jumpForm'.$crow["acontent_id"].'" method="post" enctype="multipart/form-data">';

Enjoy it, pSouper
...and please do the right thing by leaving in the copyright intact - it is only visible in the code, not on the page so there are NO geniune excuses.

[marcus@localhorst]

wouldn't it be easier, to modify the dom via mootools/js to set this class instead of hacking the core?
cheers marcus

[pSouper]

I don't think there is a better solution or a worse soultion - just different solutions. You are right that this would be a better solution but certainly not simpler imho - I think that would be adding so much code and complexity for such a little problem.
I may be nicer to ask if OG would add this extra snippet in his cnt23.article.inc.php as it has no side effects.
I sur there is also a hack that could be done to the niceforms too but this then creates a new fork of this script too.

[marcus@localhorst]

maybe I am wrong, but I would add something like this line of code in a mootools onload event
if this is the phpwcms generated code

Code: Select all

<div class="class_from_backend"><form>...</form></div>

add something like

Code: Select all

 document.addEvent( ‘domready‘ , function() {
$$('.class_from_backend').getChildren('form').addClass('niceforms'); //maybe it's wrong I'm not so familar with mootools
} );

in a customscript, before niceforms is loaded.

so class niceforms is added to the formelement and can be used by niceform script.

Sorry - maybe I fail the aim, but when I read your post, this was the first thing came in my mind if I had a similar problem of a class that is not present by default... or so...
it was just an idea, not more or less

cheers m.

[pSouper]

Hi Marcus,
To avoid editing the core you could do if with moo for sure. My only concern with this solution is that although it means you no longer need to hack the core, you now need to include a js framework and an additional snippet.
So i guess it's a case of witch ever is preferable / suitable for the job in hand

Thanks for the tip and snippet too.

If anyone would prefer the non-core-hacked version...
simply download and include mootools. create and add a file to your 'head HTML' called myMoo.js with the following code...

Code: Select all

window.addEvent( 'domready' , function() {
	var props = $$('.niceform').getChildren('form');
	$$(props).addClass('niceform');
});

note: please ensure that both mootools and myMoo are above the niceForms.js in your 'head HTML'

[Oliver Georgi]

Really no hacking necessary as far I have seen (not tested). NiceForms OnLoad JavaScript checks <form>'s class attribut against the following test pattern:

Code: Select all

class="niceform"
class="myclass niceform"
class="niceform myclass"
class="myclass niceform myotherclass"

You can fill in class name with spaces in CP form backend.

[pSouper]

Hi OG,
The problem as I find it is that the forms class is actually applied to a container div and not to the form. the niceforms script requires it to be the class of the form itself.
both my hack and Marcuses both add the class to the form element. The class that gets added is indeed set in 'form class:' field of the CP


- have I misunderstood what you are saying?

[flip-flop]

Verry simple and easy without any hack:

frontend_render (simple snippet):

Code: Select all

$content["all"] = preg_replace('/"phpwcmsForm(\d+)"/is', '"phpwcmsForm$1" class="niceform" ', $content["all"]);

frontend_render (enhanced snippet for better runtime control):

Code: Select all

// ===============================================================
// Inject class="niceform"  into <form ....


$_id = array(2,3,4,34);  // Set up the right arcticle or category -IDs to run this form replacer 

//if ( in_array($content['cat_id'],     $_id) )   // trigger for category IDs
if ( in_array($content['article_id'], $_id) )   // trigger for article IDs

	$content["all"] = preg_replace('/"phpwcmsForm(\d+)"/is', '"phpwcmsForm$1" class="niceform" ', $content["all"]);
// ===============================================================

Form template:

Code: Select all

[PHP] // Load all the necessary files 
$GLOBALS['block']['custom_htmlhead']['niceForms.js']= getJavaScriptSourceLink('template/inc_js/niceForms/niceForms.js');
$GLOBALS['block']['css']['niceForms'] = 'specific/niceForms/niceForms.css';
[/PHP]

JS file: template/inc_js/niceForms/niceForms.js
CSS file: template/specific/niceForms/niceForms.css

In css file search and replace all

Code: Select all

url(../img

to

Code: Select all

url(../../../img

Ready to run.

Knut

[update]

You can fill in class name with spaces in CP form backend.

If you populate "form class" in CP form with e.g. "contact_form niceforms" the result will be:

Code: Select all

<div class="contact_form niceforms"><form name="phpwcmsForm486" id="phpwcmsForm486" class="form-contact_form niceforms" action="......

As you easily can see it will be added to both: the container and the form tag.
This seems to be the default, I think. As far as I can understand this will enable niceforms to do it's job anyway.
Additionally you now can trigger the container (via .contact_form) and the form itself (via .form-contact_form) and both via .niceforms (it's CSS from then on)

[pSouper]

I have been discussing this with OG but I don't seem to get that result - I am testing it now... edit* nope, I'm not getting that result.
I am also testing and wrapping an OG solution using frontend render (different from the Flip-Flop solution)

[update]

My testing version is r400 - yours is ...?

[pSouper]

currently I'm testing on 1.3.9 but will install a 1.4 and test again..

I've run out of time for this weekend but I have uploaded OG's frontend render technique. It doesn't require any of the previous files and should be installed as per the directory structure in this zip file
note: you will need to add the class 'niceform' to your email content part's 'form class' - you may have to include a space or another class before it ' niceform' or 'foo niceform'

note: I haven't been able to get it to work in 1.3.9 so if you could give feedback on a 1.4 install I'd appreciate it.

have fun.

also - FYI:
niceforms allow you to create images to replace the standard form elements like this...

[flip-flop]

V1.4.5 r401: Yes indeed, if we insert a blank or other class before "niceform" in form class: [ ] it is injected into the <form ....

For older versions please do it like my previous post:

Very simple solution (frontend_render):

Code: Select all

$content["all"] = preg_replace('/"phpwcmsForm(\d+)"/is', '"phpwcmsForm$1" class="niceform" ', $content["all"]);

This snippet only injects the class="niceform" into <form ........

Before running the snippet:

Code: Select all

<form name="phpwcmsForm93" id="phpwcmsForm93" action="http://www.example.com/index.php?id=5,46,0,0,1,0#jumpForm93" method="post" enctype="multipart/form-data">

After running the snippet:

Code: Select all

<form name="phpwcmsForm93" id="phpwcmsForm93" class="niceform" action="http://www.example.com/index.php?id=5,46,0,0,1,0#jumpForm93" method="post" enctype="multipart/form-data">