Saturday, 2 June 2018

Show questions with the appropriate layout based on type (text, checkbox, select, etc) is not working properly

I have a form for a user create custom questions. For that the user needs to introduce the question (ex: Receive notifications?) and also the type of field (text, long text, checkbox, select menu, radio button). If the user selects a field of checkbox, select menu or radio button he also need to introduce the available options for the question.
In the database the questions are inserted in the questions and question_options tables like:
//questions table
id     question                    type          conference_id      
1       question1                 text                 1
2       question2                long_text             1   
3       question3                checkbox              1  
4       question4                radio_btn             1  
5       question5                select_menu            1      

//question_options table:
id     question_id                   type                
1       3                             q3op1       
2       3                              q3op2
3       4                             q4op1 
4       4                              q4op2 
5       5                              q5op1      
6       5                              q5op2      

My doubt is how to show properly in the registration.blade.php the inputs (text, radio button, checkbox, select, textarea and input file) based on the type stored in the column "type" of the questions table. For now is not working properly it is appearing like the left screen of the image but should appear like the right screen of the image:
enter image description here
Do you know why is not appearing like the right screen of the image?
In the Question model there is this getHtmlInput method():
  switch ($this->type) {
            case "text":
                  return "<input type='text' name='$name' val='$val' class='$class''" . ($required?:"required") . "/>";
            case "checkbox":
                return "<input type='checkbox' name='$name' class='$class''" . ($required?:"required") . "/>";
            case "radio_btn":
                return "<input type='radio' name='$name' class='$class''" . ($required?:"required") . "/>";
            case "select_menu":
                return "<select name='$name' class='$class''" . ($required?:"required") . "></select>";
            case "textarea":
                return "<textarea name='$name' class='$class''" . ($required?:"required") . "></textaera>";
        }

In the registration.blade.php the questions are presented with the code below:
@if ($allParticipants == 0)
    @foreach($selectedRtype['questions'] as $customQuestion)
        <div class="form-group">
            <label for="participant_question"></label>
            {!! $customQuestion->getHtmlInput(
            'participant_question[]',($customQuestion->pivot->required == "1") ? 'required' : '',
            $class = "form-control",
             $customtype=$customQuestion->type) !!}
        </div>
        @if($customQuestion->hasOptions())
            @foreach($customQuestion->options as $option)
                <p></p>
            @endforeach
        @endif
    @endforeach
@endif     

QuestionController store method to create question:
public function store(Request $request, $id){
    $this->validate($request, [
        'question' => 'required|max:255|string',
        'type' => 'required|max:255|string',
    ]);
    $conference = Conference::find($id);
    $question = Question::create([
        'conference_id' => $conference->id,
        'question' => $request->question,
        'type' => $request->type,
    ]);


    if(in_array($request->type, Question::$typeHasOptions)){
        foreach($request->input('questionOptions') as $questionOption) {
            QuestionOption::create([
                'question_id' => $question->id,
                'value' => $questionOption
            ]);
        }
    }
    Session::flash('success', 'Question created with success.');
    return redirect()->back();
}

Models:
// Question model
class Question extends Model
{
    protected $fillable = [
        'question', 'type', 'conference_id',
    ];

    public static $typeHasOptions = [
        'radio_btn',
        'select_menu',
        'checkbox'
    ];

    public function ticket_types(){
        return $this->belongsToMany('App\TicketType', 'ticket_type_questions')
            ->withPivot('required');
    }

    public function options() {
        return $this->hasMany('App\QuestionOption');
    }


    public function hasOptions() {
        return in_array($this->type, self::$typeHasOptions);
    }

    public function getHtmlInput($name = "", $val = "", $required = false, $class = "", $customtype=false)
    {
        switch ($this->type) {
            case "text":
                  return "<input type='".($customtype?:"text")."' name='$name' val='$val' class='$class''" . ($required?:"required") . ">";
            case "checkbox":
                return "<input type='".($customtype?:"checkbox")."' name='$name' class='$class''" . ($required?:"required") . ">";
            case "radio_btn":
                return "<input type='".($customtype?:"radio")."' name='$name' class='$class''" . ($required?:"required") . ">";
            case "select_menu":
                return "<input type='".($customtype?:"radio")."' name='$name' class='$class''" . ($required?:"required") . ">";
            case "textarea":
                return "<input type='".($customtype?:"radio")."' name='$name' class='$class''" . ($required?:"required") . ">";
        }
    }


}

// QuestionOption model
class QuestionOption extends Model
{
    protected $fillable = [ 'question_id', 'value' ];

    public function question() {
        return $this->belongsTo('App\Question');
    }
}



from Show questions with the appropriate layout based on type (text, checkbox, select, etc) is not working properly

No comments:

Post a Comment