JSFiddle - React, Tailwind, and code Playground
by mattography
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.min.js"></script>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<body ng-app="myApp">
<div ng-controller="myController" ng-init="init();">
<div class="container" ng-app="" ng-init="tag">
<div class="col-md-12">
<div class="col-md-4">
<form id="form">
<p>Account #:
<input type="text" class="form-control accountNumber" ng-model="accountNumber" name="accountNumber" id="accountNumber" data-placement="top" readonly>
</p>
</form>
</div>
</div>
</div>
</div>
</body>
JavaScript
var myApp = angular.module("myApp", []);
myApp.controller("myController", function ($scope, $http) {
$scope.init = function () {
var accountId = window.location.href.substr(url.indexOf("=") + 1);
if ($(".accountNumber").val() !== window.location.href + "?=") {
alert("ERROR");
} else {
$scope.accountNumber = accountId;
}
}
});
//LOOP THROUGH FORM FIELDS AND SERIALIZE JSON
$.fn.serializeObject = function () {
var o = {};
var a = this.serializeArray();
$.each(a, function () {
if (o[this.name] !== undefined) {
if (!o[this.name].push) {
o[this.name] = [o[this.name]];
}
o[this.name].push(this.value || '');
} else {
o[this.name] = this.value || '';
}
});
return o;
};
$(function () {
$("#form").validate({
rules: {
domain: {
required: true
},
playerClass: {
required: true,
},
accountNumber: {
required: true
}
},
submitHandler: function (form) {
var dataString = $('form').serializeObject();
//Save Form Data........
$.ajax({
type: "POST",
//dataType: "json",
url: "/syndicatedPlayerTagService/",
data: dataString,
success: function () {
$(".player-code").show();
$(".accountNumber, .domain, .playerClass, .fontClass, .adTag, .submit").attr("disabled", true);
$('.render-info').html("<div class='alert alert-success'>You've successfully built your player code</div>");
},
error: function () {
$(".accountNumber, .domain, .playerClass, .fontClass, .adTag, .submit").attr("disabled", true);
$('.render-info').html("<div...