Skocz do zawartości

Witamy na polskim forum Contao
Zarejestruj się teraz, aby skorzystać ze wszystkich funkcji forum. Kiedy się zalogujesz, będziesz mógł tworzyć tematy, pisać posty, rozdawać punkty reputacji, korzystać z prywatnych wiadomości i zarządzać swoim profilem. Jeśli posiadasz już konto, zaloguj się - w przeciwnym wypadku zarejestruj się już teraz!
Zdjęcie

Jak stworzyć formularz we front-endzie


  • Zaloguj się, aby dodać odpowiedź
5 odpowiedzi w tym temacie

#1
Miro

Miro

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 4 postów
Czy ktoś wie czy jest jakiś szybki sposób na stworzenie formularza we front-endzie. Mam nadzieję że nie będzie trzeba pisać całości w HTMLu od początku... :)
  • 0

#2
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
Oj trzeba napisać dużo więcej niż sam HTML :) Może być to nieco zawiłe dla początkującego developera, niemniej jednak sprezentuję przykładowy kod. Na początku, w module (np. ModuleContactForm.php) musimy zainicjować klasę formularza, którą zaraz utworzymy. Oto fragment kodu:

$objPage = $this->Database->prepare("SELECT id, alias FROM tl_page WHERE id=?")
    ->limit(1)
    ->execute($this->jumpTo);

$this->import('ContactForm');
$objConfig = new stdClass();

$objConfig->redirect = $this->generateFrontendUrl($objPage->row());
$objConfig->disableCaptcha = $this->form_disableCaptcha;

// Add form to the template
$this->ContactForm->addFormToTemplate($this->Template, $objConfig, $objItem->id, $GLOBALS['TL_CONFIG']['adminEmail']);

Przyjrzyjmy się temu nieco bliżej. Na początku pobieram sobie stronę z bazy, na którą ma przekierować formularz bo wysłaniu mejla. Dalej importujemy klasę formularza, tak żebyśmy mieli dostęp do jej licznych funkcji. Następnie tworzymy nową klasę $objConfig, gdzie możemy trzymać różne opcje konfiguracyjne tego formularza. Na końcu wywołujemy funkcję, która automatycznie doda nam formularz do obecnego szablonu. Jako jej drugi parametr przekazujemy wyżej wspomnianą klasę konfiguracyjną, a jako trzeci - identyfikator. Identyfikator potrzebny jest do nadania htmlowego ID danemu formularzowi, ale może być również użyty do umieszczenia rekordu w bazie - tu masz wolną rękę co z tym zrobić, możesz nawet nie używać go wcale :) Jako ostatni parametr dałem sobie adres e-mail administratora Contao, na który zostanie wysłany e-mail z tego formularza.

Teraz utwórzmy nową plik ContactForm.php, o następującej treści:

class ContactForm extends Frontend
{

    public function addFormToTemplate($objTemplate, $objConfig, $intId, $strNotify)
    {
        // Form fields
        $arrFields = array
        (
            'firstname' => array
            (
                'name'      => 'firstname',
                'label'     => $GLOBALS['TL_LANG']['MSC']['contact_form']['firstname'],
                'inputType' => 'text',
                'eval'      => array('mandatory'=>true, 'rgxp'=>'alpha')
            ),
            'lastname' => array
            (
                'name'      => 'lastname',
                'label'     => $GLOBALS['TL_LANG']['MSC']['contact_form']['lastname'],
                'inputType' => 'text',
                'eval'      => array('mandatory'=>true, 'rgxp'=>'alpha')
            ),
            'email' => array
            (
                'name'      => 'email',
                'label'     => $GLOBALS['TL_LANG']['MSC']['contact_form']['email'],
                'inputType' => 'text',
                'eval'      => array('mandatory'=>true, 'rgxp'=>'email')
            ),
            'subject' => array
            (
                'name'      => 'subject',
                'label'     => $GLOBALS['TL_LANG']['MSC']['contact_form']['subject'],
                'inputType' => 'text',
                'eval'      => array('mandatory'=>true, 'rgxp'=>'alnum')
            ),
            'message' => array
            (
                'name'      => 'message',
                'label'     => $GLOBALS['TL_LANG']['MSC']['contact_form']['message'],
                'inputType' => 'textarea',
                'eval'      => array('mandatory'=>true)
            )
        );
		
        // Add captcha field
        if (!$objConfig->disableCaptcha)
        {
            $arrFields['captcha'] = array
            (
                'name'      => 'captcha',
                'inputType' => 'captcha',
                'eval'      => array('mandatory'=>true)
            );
        }		

        $doNotSubmit = false;
        $arrWidgets = array();
        $strFormId = 'con_' . $intId;

        // Initialize widgets
        foreach ($arrFields as $arrField)
        {
            $strClass = $GLOBALS['TL_FFL'][$arrField['inputType']];

            // Continue if the class is not defined
            if (!$this->classFileExists($strClass))
            {
                continue;
            }

            $arrField['eval']['required'] = $arrField['eval']['mandatory'];
            $objWidget = new $strClass($this->prepareForWidget($arrField, $arrField['name'], $arrField['value']));

            // Validate the widget
            if ($this->Input->post('FORM_SUBMIT') == $strFormId)
            {
                $objWidget->validate();

                if ($objWidget->hasErrors())
                {
                    $doNotSubmit = true;
                }
            }

            $arrWidgets[$arrField['name']] = $objWidget;
        }

        $objTemplate->fields = $arrWidgets;
        $objTemplate->submit = $GLOBALS['TL_LANG']['MSC']['submit'];
        $objTemplate->action = ampersand($this->Environment->request);
        $objTemplate->formId = $strFormId;
        $objTemplate->hasError = $doNotSubmit;
		
        // Submit form
        if ($this->Input->post('FORM_SUBMIT') == $strFormId && !$doNotSubmit)
        {		
            // Insert record to the database
            $arrSet = array
            (
                'from' => sprintf('%s %s <%s>', $arrWidgets['firstname']->value, $arrWidgets['lastname']->value, $arrWidgets['email']->value),
                'subject' => $arrWidgets['subject']->value,
                'text' => $arrWidgets['message']->value
            );

            $insertId = $this->Database->prepare("INSERT INTO tl_emails %s")->set($arrSet)->execute($arrSet)->insertId;

            // Send the e-mail
            $objEmail = new Email();
			
            $objEmail->from = $arrWidgets['email']->value;
            $objEmail->fromName = trim($arrWidgets['lastname']->value . ' ' . $arrWidgets['firstname']->value);
            $objEmail->subject = trim($arrWidgets['subject']->value);
            $objEmail->text = $arrWidgets['message']->value . "\n\n" . 'E-mail ID: ' . $insertId;

            // E-mail sent successfully
            if ($objEmail->sendTo($strNotify))
            {			
                $objTemplate->confirm = $GLOBALS['TL_LANG']['MSC']['contact_form']['success'];
            }
			
            // Redirect
            $this->redirect($objConfig->redirect);
        }
    }
}

Najsampierw zdefiniowaliśmy listę pól formularza, zresztą bardzo podobnie jak w DCA. Następnie zainicjowaliśmy wszystkie pola i przypisaliśmy je do templatki. Po drodze przeprowadziliśmy jeszcze walidację na podstawie danych z $arrFields. Jeśli walidacja się powiedzie, to kolejno dodajemy rekord do bazy danych, a następnie wysyłamy e-mail do administratora Contao.

Natomiast templatka mod_contact_form.tpl wygląda tak:

<div class="<?php echo $this->class; ?> block"<?php echo $this->cssID; ?><?php if ($this->style): ?> style="<?php echo $this->style; ?>"<?php endif; ?>>
<?php if ($this->headline): ?>

<<?php echo $this->hl; ?>><?php echo $this->headline; ?></<?php echo $this->hl; ?>>
<?php endif; ?>

<!-- indexer::stop -->
<div class="form">
<?php if ($this->confirm): ?>

<p class="confirm"><?php echo $this->confirm; ?></p>
<?php else: ?>

<form action="<?php echo $this->action; ?>" id="<?php echo $this->formId; ?>" enctype="multipart/form-data" method="post">
<div class="formbody">
<input type="hidden" name="FORM_SUBMIT" value="<?php echo $this->formId; ?>" />
<div class="widget">
	<?php echo $this->fields['firstname']->generateLabel(); ?> <?php echo $this->fields['firstname']->generateWithError(); ?> 
</div>
<div class="widget">
	<?php echo $this->fields['lastname']->generateLabel(); ?> <?php echo $this->fields['lastname']->generateWithError(); ?> 
</div>
<div class="widget">
	<?php echo $this->fields['email']->generateLabel(); ?> <?php echo $this->fields['email']->generateWithError(); ?> 
</div>
<div class="widget">
	<?php echo $this->fields['subject']->generateLabel(); ?> <?php echo $this->fields['subject']->generateWithError(); ?> 
</div>
<div class="widget">
	<?php echo $this->fields['message']->generateLabel(); ?> <?php echo $this->fields['message']->generateWithError(); ?> 
</div>
<?php if (isset($this->fields['captcha'])): ?>
<div class="widget">
	<?php echo $this->fields['captcha']->generateWithError(); ?> <label for="ctrl_captcha"><?php echo $this->fields['captcha']->generateQuestion(); ?><span class="mandatory">*</span></label>
</div>
<?php endif; ?>
<div class="submit_container">
  <input type="submit" class="submit" value="<?php echo $this->submit; ?>" />
</div>
</div>
</form>

<?php if ($this->hasError): ?>

<script type="text/javascript">
<!--//--><![CDATA[//><!--
window.scrollTo(null, ($('<?php echo $this->formId; ?>').getElement('p.error').getPosition().y - 20));
//--><!]]>
</script>
<?php endif; ?>
<?php endif; ?>

</div>
<!-- indexer::continue -->

</div>

Tutaj nie ma co się rozpisywać, ot tworzymy formularz i dodajemy do niego pola. No i to w zasadzie tyle. Mam nadzieję, że cię nie zraziłem do napisania formularza :) Zawsze możesz jednak wygenerować sobie formularz np. za pomocą rozszerzenia EFG.
  • 0

Codefog - Contao web development


#3
Miro

Miro

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 4 postów
Super! Na pierwszy rzut oka wygląda nieco skomplikowanie ale jak się wczytać... Jeszcze raz wielkie dzięki. Dam znać czy mi się udało :D
  • 0

#4
Miro

Miro

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 4 postów
Z jakiegoś powodu całość siada jak tylko próbuję połączyć się z Bazą Danych i coś pobrać / wysłać....

$objPage = $this->Database->prepare("SELECT id, alias FROM tl_page WHERE id=?")->limit(1)->execute($this->jumpTo);

  • 0

#5
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
Po pierwsze włącz wyświetlanie błędów w ustawieniach Contao, będziemy mieli jakiś punkt zaczepienia.

Po drugie sprawdź, czy poprawnie osadziłeś moduł - http://contao.pl/bud...kod-modulu.html. Jeśli nie wiesz jak to zrobić, załącz swoje pliki tutaj w poście, albo podeślij mi na mejla/prywatną wiadomość.
  • 0

Codefog - Contao web development


#6
Miro

Miro

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 4 postów
Problem rozwiązany :) Musiałem tylko zaimportować klasę "Database"...
  • 0




Użytkownicy przeglądający ten temat: 2

0 użytkowników, 2 gości, 0 anonimowych użytkowników