JSFiddle - React, Tailwind, and code Playground

HTML

<form method="POST" id="form-horizontal">

  <label> Name
     <input type="text" data-bind="textInput: user().name" id="id_name">
                    </label>

  <label>Email
     <input type="text" data-bind="textInput: email" id="id_email">
                    </label>

  <label> Contact number
                        <input type="text" data-bind="textInput:       $data.contact_number" id="id_contact_number">
                    </label>

  <label>Web address
                        <input type="text" data-bind="textInput: web_address" id="id_web_addess">
                    </label>

  <label>Message
                        <input type="text" data-bind="textArea:message" id="id_message">
                    </label>

  <input type="submit" value="Submit" id="id_submit" data-bind="click:$root.submit">

JavaScript

var user = function() {
  var self = this;
  self.name = ko.observable('name');
  self.email = ko.observable('[email protected]');
  self.contact_number = ko.observable('contact_number');
  self.web_address = ko.observable('web_address');
  self.message = ko.observable('message');
};

function ContactViewModel() {

  this.name = ko.observable('Prudence');
  this.email = ko.observable('[email protected]');
  this.contact_number = ko.observable('contact_number');
  this.web_address = ko.observable('web_address');
  this.message = ko.observable('message');

  var self = this;

  self.submit = function() {

    var user_details = new Object();
    //
    // .name = ko.observable('name');
    // self.email = ko.observable('email');
    // self.contact_number = ko.observable('contact_number');
    // self.web_address = ko.observable('web_address');
    // this.message = ko.observable('message');


    user_details.name = self.name();
    user_details.email = self.email();
    user_details.web_address = self.web_address();
    user_details.contact_number = self.contact_number();
    user_details.message = self.message();


    var app_host = 'http://127.0.0.1:8000';

    var url_post = '/api/company-lead/';

    $.ajax({
      url: app_host + url_post,
      type: 'POST',
      csrfmiddlewaretoken: "{{csrf_token}}",
      dataType: 'json',
      data: JSON.stringify(user_details),
      contentType: 'application/json',
      ajaxSuccess: function() {
        return alert("Submitted Successfully")
      }
    }).done(function() {
      alert("Successfully submitted");
    });

  };
}



contactModel = new ContactViewModel(user);