4.5 Expanding Views

Expanding Views

Add a new view for an existing controller

To add a new view for an existing controller, you have to add a new .ehtml file to its view folder (www/views/<controller name>). For example, if we want to add a new view for application controller, which will be shown when the registration of a new user failed, we would add a new file named reg_failed.ehtml to www/views/application which would contain the view definition.

Add views of a new controller

Adding the views of a new controller is as simple as the process of adding a new view to an existing controller. The only difference is that you first need to create the corresponding folder in www/views. In order to add the only view of calendar controller, create a new file in www/views/calendar, name it create_appointment.ehtml, and copy the following code into it.

@contentFor("header"){
   <h1>
      @localize("create_appointment_header")
   </h1>
}@

@contentFor("content"){
  <div id="create_appointment">

    <label for="subject">
      @localize("subject_label")
    </label>
    <input type="text" name="subject" id="subject" value="">

    <label for="app-date">
      @localize("date_label")
    </label> 
    <input name="app-date" id="app-date" type="date" data-role="datebox"  
           data-options='{"mode": "flipbox"}' >

    <label for="start-time">
      @localize("start_time_label")
    </label>
    <input name="start-time" id="start-time" type="date" data-role="datebox"  
           data-options='{"mode": "timeflipbox"}' >

    <label for="end-time">
      @localize("end_time_label")
    </label>
    <input name="end-time" id="end-time" type="date" data-role="datebox"  
           data-options='{"mode": "timeflipbox"}'>
    
    <button id="save_appointment" name="save_appointment_btn" 
            data-inline="true">
        @localize("save")
    </button>
    <button id="discard_appointment" name="discard_appointment_btn" 
            data-inline="true">
        @localize("discard")
    </button>
  </div>
}@

As the last step in adding a new view, the MMIR framework needs to be told, that there is an additional view, that is needs to process (i.e. load on startup of the application). The default Ant task generateFileListJSONFile in /build.xml creates the appropriate information by updating the file directories.json in assets/www/config/.

---

< previous: "Expanding Controllers" | next: "Expanding Models" >