JSFiddle - React, Tailwind, and code Playground

by ncubica

HTML

<label><input type="Radio" name="gender" id="male" value="male" /> male</label>
<label><input type="Radio" name="gender" id="female" value="female" />female</label>
<input type="text" id="name" placeholder="name" />
<input type="text" id="lastname" placeholder="lastname" />
<input type="button" id="submit" value="store" />

JavaScript

var survey = (function(_module){
    var modulename = _module;
    var user = {};
    /*private methods*/
    
    function init(){
        observers();
    }
    
    function observers(){
        $(document).on("click","#submit", survey.store)
    }
    
    /*public methods*/
    $r = {}
    
    $r.store = function(){
        user.name = $("#name").val();
        user.lastname = $("#lastname").val();
        user.gender = $("input:radio[name=gender]:checked").val();
        survey.toString();
    }
    
    $r.toString = function(){
        var genderStr = (user.gender == "male") ? "Man" : "Girl";
        alert(user.name + " " + user.lastname + " is " + genderStr);
    }
    
    $r.init = function(){
        init();
    }
    
    return $r;
})("survey")

survey.init();