Jump to:

2002 Posts in 1422 Topics by 616 members

Form Questions

SilverStripe Forums » Form Questions » How to call an Uploadify field in costumized form?

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 1371 Views
  • poblom
    Avatar
    Community Member
    25 Posts

    How to call an Uploadify field in costumized form? Link to this post

    Hi,

    How would you call an Uploadify field to be used in a costumized front end form? I'm aware of the function $dataFieldByName() which works well for most of my fields but it can't handle Date fields or an Uploadify field. I have managed to get the date fields working by calling all the necessary js and hard coding the metadata but what about an uploadify field? Calling all the js files makes the field appear but without the metadata no functionality. Is this even possible?

    By letting Silverstripe scaffold the form it works well and I can achieve most of what I want by some css manipulating and jQuery but it would be so much cleaner if I could build my own template from ground up.

  • Ryan M.
    Avatar
    Community Member
    309 Posts

    Re: How to call an Uploadify field in costumized form? Link to this post

    Can you paste your controller code? I'll tell you where to add the Uploadify field.

  • poblom
    Avatar
    Community Member
    25 Posts

    Re: How to call an Uploadify field in costumized form? Link to this post

    Hi, and thanks for answering.

    I have pasted here relevant parts of my controller and also parts of my template to further illustrate what i want to do.

    By calling the form the "usual" way like below everything works well. My datefields and uploadify field works as expected. The problem with this approach is that costumising the form layout is, not impossible but, quite dounting.

    <div class="typography">
          
       <h1>$Title</h1>
       <div id="FormContainer">
          
          $ApplyForm
       
       </div>
    </div>

    What I would like is to "handcraft" my form template using $dataFieldByName() to render individual fields. This works fine for regular data fields but how to call a uploadify field. I have had some success calling it the way you can see in the template code by also calling all the js and by hardcoding metadata into the the template UploadifyField.ss. My question really is - Is there a correct way to call that field that makes it work in all its glory in a handcrafted front end form??

    Found a quite similar problem here: http://www.silverstripe.org/general-questions/show/14452

    Part of the controller

    class ApplicationPage_Controller extends Page_Controller
    {

       public function init() {
          parent::init();
       /* Requirements::javascript(THIRDPARTY_DIR . '/jquery/jquery.js'); */
    /*
       Requirements::javascript(SAPPHIRE_DIR . '/javascript/jquery_improvements.js');   
       Requirements::css(THIRDPARTY_DIR . '/jquery-ui-themes/smoothness/jquery.ui.all.css');
       Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-ui/jquery.ui.core.js');
       Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-ui/jquery.ui.datepicker.js');
       Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-ui/i18n/jquery.ui.datepicker-sv.js');   
       Requirements::javascript(THIRDPARTY_DIR . "/jquery-metadata/jquery.metadata.js");
       Requirements::javascript(SAPPHIRE_DIR . "/javascript/DateField.js");
       
       Requirements::javascript("uploadify/javascript/swfobject.js");
       Requirements::javascript("uploadify/javascript/uploadify.js");
       Requirements::javascript(THIRDPARTY_DIR."/jquery-livequery/jquery.livequery.js");
       Requirements::javascript("uploadify/javascript/uploadify_init.js");
       Requirements::themedCSS("uploadify");
    */
       Requirements::javascript("themes/mytheme5/javascript/formlegend.js");
       }
          

       protected function ApplyForm() {
          
          $firstName = new TextField('FirstName', 'Förnamn');
          $firstName->addExtraClass('mytext');
          $lastName = new TextField('LastName', 'Efternamn');
          $lastName->addExtraClass('mytext');
    // Lots of other fields here
          $supplements = new MultipleFileUploadField('Supplements', 'Ladda upp bilagor');
          $supplements->setFileTypes(array('doc','docx','xls','xlsx','pdf'));
          /* $supplements->uploadOnSubmit(); */
          
          $fields = new FieldSet(
             $firstName,
             $lastName,      
             // Lots of other fields
             $supplements
             );
             
          $send = new FormAction('doApply', 'Skicka ansökan');
          $actions = new FieldSet($send);
          $validator = new RequiredFields(
             $firstName,
             $lastName
             );
          
          return new Form($this, 'ApplyForm', $fields, $actions, $validator);
       
       }

       
       public function doApply($data, $form) {
          $form->saveInto($application = new Application());
          $application->write();
          return array (
             'Application' => $application
          );

       }
       
    }

    And some template code

    <% control ApplyForm %>

             <form $FormAttributes>
                <% if Message %>
                   <p id="{$FormName}_error" class="message $MessageType">
                   $Message
                   </p>
                <% else %>
                   <p id="{$FormName}_error" class="message $MessageType"></p>
                <% end_if %>
                
                <fieldset>
                <legend class="forminfo">&nbsp;&nbsp;Basinformation&nbsp;&nbsp;</legend>
                <div id="FirstName" class="field text group">
                   <label class="left" for="Form_ApplyForm_FirstName">
                   Sökandens förnamn<span class="required">*</span>
                   </label>
                
                   <div class="middleColumn textColumn">
                   $dataFieldByName(FirstName)
                   </div>
                
                </div>
                
                <div id="LastName" class="field text group">
                   <label class="left" for="Form_ApplyForm_LastName">
                   Sökandens efternamn<span class="required">*</span>
                   </label>
                
                   <div class="middleColumn textColumn">
                   $dataFieldByName(LastName)

                   </div>
                
                </div>

             <!-- Loads of other fields here -->

                <div id="Supplements" class="field UploadifyField group">
                   <label class="left" for="Form_ApplyForm_Supplements">
                   Ladda upp bilagor<span class="required">*</span>
                   </label>
                
                   <div class="middleColumn smallColumn">                  
    <% include UploadifyField %>
                   </div>
                   
                </div>
          
                </fieldset>
                $dataFieldByName(SecurityID)
                <% if Actions %>
                   <div class="Actions">
                      <% control Actions %>$Field<% end_control %>
                   </div>
                <% end_if %>
             </form>

    <% end_control %>

  • Ryan M.
    Avatar
    Community Member
    309 Posts

    Re: How to call an Uploadify field in costumized form? Link to this post

    You seem to be customizing it the correct way. I'd probably wait until UncleCheese notices this thread and provides his own insight.

  • chillburn.com.au
    Avatar
    Community Member
    12 Posts

    Re: How to call an Uploadify field in costumized form? Link to this post

    from my understanding, the $dataFieldByName(field) looks for a function called Field which renders the form element. this doesn't exist on the uploadify class. The uploadify class is using the function FieldHolder

    what you can do is add the following function to the uploadify class.

    this is in the uploadify/code/UploadifyField.php

    abstract class UploadifyField extends FormField
    {
    ...
    public function Field() {
    return $this->FieldHolder();
    }
    ...
    }

    However, when i upload a file, i get a HTTP error. I don't know if this is to do with the facebook connect module or if its something else. Uploadify does work in the admin tho, just not the front end. I haven't tried this without facebook connect.

  • chillburn.com.au
    Avatar
    Community Member
    12 Posts

    Re: How to call an Uploadify field in costumized form? Link to this post

    just found out that u can use $dataFieldByName(field).FieldHolder so there is no need to change the code.

    1371 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.