Jump to content

Always text in label


Harmen
 Share

Recommended Posts

Hi all,

I am trying to build a form in a module. So when the render() method is called, I build the form and I want to apply a custom markup, which is defined in an array.

Unfortunately I can't remove some text in my label. Instead of a label I want an icon, but there is always some text next to my icon as you can see below:

e1ef4dc55d20797eadbe5b755f503124.png
I don't know how, but my icon is placed in the label, and that's not what I want.

My markup looks like this:

static protected $markup = array(
        'list' => "{out}\n",
        'item' => "\n\t<div class='form-group input-group'>\n{out}\n\t</div>",
        'item_label' => "<label class=input-group-addon>{out}</label>",
        'item_icon' => "<span><i class='fa fa-fw fa-{name}' aria-hidden='true'></i></span>",
        'item_content' => "{out}",
        'item_error' => "\n<p class='field--error--message'>{out}</p>",
        'item_description' => "\n<p class='field__description'>{out}</p>",
		//.... etc
    );

and results in this:

<div class="form-group input-group">
	<label class="input-group-addon">
      	<span>
          	<i class="fa fa-fw fa-envelope" aria-hidden="true"></i>
      	</span>
      	E-Mail
  	</label>
	<input id="Inputfield_contact_email" name="contact_email" class="form-control InputfieldMaxWidth" type="email" maxlength="512">
</div>

 

and what I want is:

<div class="form-group input-group ">
        <span id="contact_form" class="input-group-addon"><i class="fa fa-user" aria-hidden="true"></i></span>
        <input required="" class="form-control" name="name" id="contact_form" type="text" value="" placeholder="Name">
</div>

The only problem is that the code above is hard-coded and I don't know how to remove that piece of text next to my icon....

Thanks in advance,

~Harmen

Link to comment
Share on other sites

Since bootstrap uses the input group addon to position the icon within the container, your code is also setting the label to email, which also appears. Removing the label entry should remove the text and leave the icon.

so 'item_label' => "<label class=input-group-addon>{out}</label>" should be 'item_label' => "<label class=input-group-addon></label>"

 

Link to comment
Share on other sites

Hello for all,

don't know If I understand You well, but if you are using PW inputfields (modules/API) to build form, than to remove label from some field need to do that in two small steps. First set field label as blank (""), and after it set option "skiplabel" to "true".

Example:

$myfield->label = '';
$myfield->skipLabel = true;

Regards.

Link to comment
Share on other sites

@fbg13:

// === The render method that links to the render form method
public function ___render(){
	return $this->renderForm();
}

// === The renderForm() method
protected function renderForm() {
	$form = $this->BuildForm();
	$form->setMarkup(self::$markup);

	// === Pressed submit?
	if ($this->input->post->submit){
		$form->processInput($this->input->post);

		if (!$form->getErrors()){
			if ($this->sendEmail == true){
				$text = 'Configure Email options' //to do
				
			}
		}
	}
	return isset($text) ? $text : $form->render();
}

// === Build Form Method
protected function BuildForm(){    
        $form = $this->modules->get('InputfieldForm');
        $form->method = 'post';
        $form->attr('id+name', 'rma-form');

        // === Add the fields to the form
        if (is_array($this->GeneralfieldsSelector)) {
            foreach($this->GeneralfieldsSelector as $fieldName){
                if ($field = $this->fields->get($fieldName)){
                    $input = $field->getInputfield($this->page);
                    $input->attr('class', 'form-control');
                    $input->skipLabel = true;
                    $form->append($input);
                }
            }
        }

        // === Submit button
        $submit = $this->modules->get('InputfieldSubmit');
        $submit->name = 'submit';
        $submit->attr('class', 'btn btn_default');
        $submit->attr('value', 'Send RMA request');
        $form->append($submit);

        return $form;
    }

I don't think the problem is in this piece of code, but maybe I've done something wrong......

// ======

@OLSA: I've tried that mate, but it doesn't work... Thanks for your comment though!

Link to comment
Share on other sites

Yep, these are modules like Batch Child Editor, Tracy Debugger, ReCaptcha and some custom made modules. 

But I don't think any of these modules conflict with the module I am working on now.

Link to comment
Share on other sites

With this markup and field options :

$markup = array(
	'list' => "{out}\n",
	'item' => "\n\t<div class='form-group input-group'>\n{out}\n\t</div>",
	'item_label' => "{out}",
	'item_icon' => "<span><i class='fa fa-fw fa-{name}' aria-hidden='true'></i></span>",
	'item_content' => "{out}",
	'item_error' => "\n<p class='field--error--message'>{out}</p>",
	'item_description' => "\n<p class='field__description'>{out}</p>",
	'item_toggle' => ''

//.... etc
);


// field setup
$field->icon = 'envelope';
$field->label = ' ';

I get the following result :

<div class="form-group input-group">
	<span>
		<i class="fa fa-fw fa-envelope" aria-hidden="true"></i>
	</span> 
	<input id="name" class="InputfieldMaxWidth" name="name" maxlength="2048" type="text">
</div>

 

Another idea could be to set the markup option of the label to something like {{replaceme}} {out} {{/replaceme}} and change those tags when you render the form with a str_replace or a custom function, you see ?

Link to comment
Share on other sites

I meant modules used to build the form.

$this->GeneralfieldsSelector I couldn't find this in the core, that's why I asked. 

'item_label' => "<label class=input-group-addon>{out}</label>",

Somewhere {out} gets replaced with

<span>
  <i class="fa fa-fw fa-envelope" aria-hidden="true"></i>
</span>
E-Mail

You can find out where and edit/overwrite the default behavior or before you echo the form do a search and replace

str_replace( "E-Mail" , "" , $form )

Or you could just create the form yourself and have complete control over it.

Link to comment
Share on other sites

@fbg13, you're a real hero! :) 

EDIT: Uh, I meant also @flydev, your code did the trick. 

Now it looks like it should look! Thanks!

3421487a758e78b66d16388df0ae9bcb.png

I think the space between the ' ' did the trick, I am not sure but I will spend this evening to figure out what I did wrong.

 

13 hours ago, fbg13 said:

$this->GeneralfieldsSelector I couldn't find this in the core, that's why I asked. 

I am building this module to make the process for handling RMA's in my company easier. So I am creating a module and $this->GeneralfieldsSelector grabs all the fields that are selected in the module settings to show them on the frontend. I didn't want to build the form itself because maybe I will also release this module here on PW and than is this a bit better than a custom made HTML-form XD

Edited by Harmen
Forgot to tag someone
  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Similar Content

    • By Juergen
      Hello @ all
      I want to share a new module with you, which makes the creation and validation of forms easy.  Take a look at the following example of a simple contact form:
      // A very simple example of a contactform for demonstration purposes $form = new Form('contactform'); $gender = new Select('gender'); $gender->setLabel('Gender'); $gender->addOption('Mister', '0'); $gender->addOption('Miss', '1'); $form->add($gender); $surname = new InputText('surname'); $surname->setLabel('Surname'); $surname->setRule('required'); $form->add($surname); $name = new InputText('name'); $name->setLabel('Name'); $name->setRule('required'); $form->add($name); $email = new InputText('email'); $email->setLabel('E-Mail'); $email->setRule('required'); $form->add($email); $subject = new InputText('subject'); $subject->setLabel('Subject'); $subject->setRule('required'); $form->add($subject); $message = new Textarea('message'); $message->setLabel('Message'); $message->setRule('required'); $form->add($message); $privacy = new InputCheckbox('privacy'); $privacy->setLabel('I accept the privacy policy'); $privacy->setRule('required')->setCustomMessage('You have to accept our privacy policy'); $form->add($privacy); $button = new Button('submit'); $button->setAttribute('value', 'Send'); $form->add($button); if($form->isValid()){ print_r($form->getValues()); // do what you want } // render the form echo $form->render(); This piece of code creates a simple contact form and validates it according to the validation rules set. Inside the isValid() method you can run your code (fe sending an email)
      Highlights:
      30+ validation types Support for UiKit 3 and Bootstrap 5 CSS framework SPAM protection Highly customizable Hookable methods for further customization Multi-language You can download and find really extensive information on how to use at https://github.com/juergenweb/FrontendForms.
      Please report errors or suggestions directly in GitHub.
      Best regards and happy testing 🙂
    • By Pip
      Hi Everyone!
      I'd like to set a different label on my Title (PageTitle) field in one particular template.  Is there a way to do so? 
      Thanks. 
    • By benbyf
      Hi, Looking to create form elements on a page–some input with a colection of form inputs and the appropriate labels and variables for that input. I've used ProForms in the past and rolled out my own when creating simply one off forms, but I wonder if anyone has found a good way of allowing form creation on page editing so that clients can adhocly make and edit forms?
      Thanks
    • By Mithlesh
      Changing it to null
    • By Tyssen
      I have a page that contains a single ProFields table field and I want to display the contents of the table on the front end and then for logged in users, they can edit certain columns in the table.
      What I have at the moment is
      $out = '<form action="'.$page->url.'" method="post" > <table class="table"> <tbody>'; $count = 1; foreach($page->fieldName as $row) : $out .= ' <tr> <td><input type="checkbox" name="fieldName_'.$count.'_columnName"></td> </tr>'; if($input->post->submit) : $page->of(false); $page->set('fieldName_'.$count.'_columnName', $sanitizer->text($input->post->{fieldName_'.$count.'_columnName})); $page->save(); endif; $count++; endforeach; $out .= ' </tbody> </table> <button class="button" type="submit">Save</button> </form>'; The two problems I have are:
      I get an error trying from $sanitizer->text($input->post->{fieldName_'.$count.'_columnName}), not sure how to make that dynamic.  If I change the above to just a static value, e.g. $page->set('fieldName_1_columnName', 'Testing') and save the form, it's not saving the values to the database. Where am I going wrong?
×
×
  • Create New...