Problem: I am unable to clear the fields of the form completely.
Let me be more specific. When I go to the console, it appears that the previous entries are still present even though the reset button has been selected.
I have done the following in the form. I have a submit button and a reset button.
<div class="panel panel-default">
<div class="panel-body">
<form name="providerSearch" ng-submit="SearchProvider(searchParam);" novalidate role="form">
<div class="form-group"><input class="form-control" id="physiciansfirstname" ng-model="searchParam.FirstName" placeholder="First name:" type="text" /></div>
<div class="form-group"><input class="form-control" id="physicianslastname" ng-model="searchParam.LastName" placeholder="Last name:" type="text" /></div>
<!---<div class="form-group">
<select class="form-control" id="providerSpecialty" ng-model="searchParam.Specialty">
<option disabled="disabled" selected="selected" value="">Specialty</option>--->
<!---<option disabled="disabledvalue=""></option>---><!---<option>Family practice</option><option>General practice</option><option>Internal medicine</option><option>Pediatrics</option>
</select>--->
<div class="form-group">
<select class="form-control" id="providerSpecialty" ng-model="searchParam.Specialty">
<option selected="selected" value="">Specialty</option>
<!---<option value=""></option>--->
<cfoutput query="SpFind">
<option value=#ProviderSpecialty#>#ProviderSpecialty#</option>
</cfoutput>
</select>
</div>
<div class="form-group">
<select class="form-control" id="city" ng-model="searchParam.City">
<option selected="selected" value="">City</option>
<!---<option value=""></option>--->
<cfoutput query="cityFind">
<option value=#city#>#city#</option>
<!---<option ng-selected="{{searchParam.City==#city#?true:false}} value=#city#>#city#</option>--->
</cfoutput>
</select>
<!---<select class="form-control" id="city" ng-model="searchParam.City"><option disabled="disabled" selected="selected" value="">City</option><option ng-repeat="c in Cities" value="{{c.City}}">{{c.City}}</option> </select>--->
</div>
<div class="row">
<!---<div class="col-xs-6 no-right-padding paddingLanguage">
<div class="form-group widthLanguage">
<select id="language" name="language" class="form-control" ng-model="searchParam.Language">
<option disabled="disabled" selected="selected" value="">Language</option>
<!---<option value=""></option>--->
<cfoutput query="Languages">
<option value=#Language#>#Language#</option>
</cfoutput>
</select>
<!---<select name="language" class="form-control widthLanguage" id="language" ng-model="searchParam.Language">
<option disabled="disabled" selected="selected" value="">Language</option>
<option ng-repeat="l in Languages">{{l.Lang}}</option>
</select>--->
</div>
</div>--->
<div class="col-xs-6 no-left-padding">
<div class="form-group"><select class="form-control" id="gender" name="gender" ng-model="searchParam.Gender">
<option selected="selected" value="">Gender</option>
<!---<option value=""></option>--->
<option>Male</option><option>Female</option> </select></div>
</div>
</div>
<hr class="hrDoctor" />
<div style="margin-top:-10px; margin-bottom:10px; text-align:center; font-size:8pt! important">* or Search by Zip code radius *</div>
<div class="row">
<div class="col-xs-7 no-right-padding">
<div class="form-group">
<div class="input-group">
<select class="form-control" id="miles" name="distance" ng-model="searchParam.Distance">
<!---<option selected="selected" value="" disabled="disabled">Miles</option>--->
<option selected="disabled" value=""></option>
<option value={{v.value}} ng-repeat="(k , v) in miles track by $index">{{v.value}}</option>
<!---<option selected="disabled" value=""></option>
<option selected="selected" value="5">5</option>
<option selected="selected" value="10">10</option>
<option selected="selected" value="15">15</option>
<option selected="selected" value="20">20</option>--->
</select>
<div class="input-group-addon">mi</div>
</div>
</div>
</div>
<div class="col-xs-5 no-left-padding widthZip">
<div class="form-group">
<input allow-pattern="[\d\W]" class="form-control" id="zip" maxlength="5" ng-model="searchParam.Zip" placeholder="Zip code" type="text" />
</div>
</div>
</div>
<div class="form-group">
<input class="btn btn-warning btn-block" onclick="return checkTextField(); overlayDisplayButton();" ng-click="gotoElement('SearchResultsAnchor');" type="submit" value="Search" />
<div style="margin-top:10pt"><button type="reset" class="btn btn-info btn-block" ng-click="reset()">Reset</button></div>
</div>
</form>
</div>
Here is the following script to reset the form:
$scope.reset = function(form) {
form.$setPristine();
form.$setUntouched();
};
What am I missing to reset the form completely?
This should be your reset function:
$scope.reset = function() {
$scope.searchParam = {};
$scope.providerSearch.$setPristine();
$scope.providerSearch.$setUntouched();
};
where providerSearch is a form name.
I was trying to disable the submit button, when the fields are empty. But its not working. Don't know why its not working. Saw many blogs, but could't figure whats the issue.
<form name="createForm">
<div class="form-group col-md-6">
<label for="createName">Student</label>
<select class="form-control" name="student" id="createName" ng-
model="createStudent.studentId" ng-options="item.name for item in
allStudent" required>
<option value="" selected disabled>Select</option>
</select>
</div>
<div class="form-group col-md-6">
<label for="createClass">Class</label>
<select class="form-control" name="class" id="createClass" ng-
model="createStudent.classId" ng-options="item.number for item in
allClass" required>
<option value="" selected disabled>Select</option>
</select>
</div>
</div>
<div class="form-group col-md-6 text-md-center">
<label for="createCategory">Type of Category</label>
<select class="form-control" name="category" id="createCategory"
ng-model="createStudent.type" ng-options="item.category_type for
item in allcategoriestypes" required>
<option value="" selected disabled>Select</option>
</select>
</div>
</div>
<div class="row align-items-end justify-content-center">
<div class="form-group col-md-6 text-md-center">
<label for="createTeacherName">Teacher Name</label>
<input type="text" class="form-control" name="teacher"
id="createTeacherName" ng-model="createStudent.name"
placeholder="Enter Teacher Name" required>
</div>
</div>
</div>
<div class="text-center pt-1">
<button type="submit" class="btn btn-info px-5" ng-
click="create(createStudent)" ng-
disabled="createForm.$invalid">Save</button>
</div>
</form>
it is working fine.it disable the submit button, when the fields are empty.
<!DOCTYPE html>
<html>
<body>
<form name="createForm">
<div class="form-group col-md-6">
<label for="createName">Student</label>
<select class="form-control" name="student" id="createName" ng-
model="createStudent.studentId" ng-options="item.name for item in
allStudent" required>
<option value="" selected disabled>Select</option>
</select>
</div>
<div class="form-group col-md-6">
<label for="createClass">Class</label>
<select class="form-control" name="class" id="createClass" ng-
model="createStudent.classId" ng-options="item.number for item in
allClass" required>
<option value="" selected disabled>Select</option>
</select>
</div>
</div>
<div class="form-group col-md-6 text-md-center">
<label for="createCategory">Type of Category</label>
<select class="form-control" name="category" id="createCategory"
ng-model="createStudent.type" ng-options="item.category_type for
item in allcategoriestypes" required>
<option value="" selected disabled>Select</option>
</select>
</div>
</div>
<div class="row align-items-end justify-content-center">
<div class="form-group col-md-6 text-md-center">
<label for="createTeacherName">Teacher Name</label>
<input type="text" class="form-control" name="teacher"
id="createTeacherName" ng-model="createStudent.name"
placeholder="Enter Teacher Name" required>
</div>
</div>
</div>
<div class="text-center pt-1">
<button type="submit" class="btn btn-info px-5" ng-
click="create(createStudent)" ng-
disabled="createForm.$invalid">Save</button>
</div>
</form>
</body>
</html>
Please find the working plunker for your code :
http://plnkr.co/edit/H1LOahFNWRXYHWTVmrcW?p=preview
<form name="createForm">
<div class="form-group col-md-6">
<label for="createName">Student</label>
<select class="form-control" name="student" id="createName" ng-
model="createStudent.studentId" required>
<option value="studentValue">Student Name</option>
</select>
</div><br/>
<div class="form-group col-md-6">
<label for="createClass">Class</label>
<select class="form-control" name="class" id="createClass" ng-
model="createStudent.classId" required>
<option value="classValue">Class</option>
</select>
</div><br/>
<div class="form-group col-md-6 text-md-center">
<label for="createCategory">Type of Category</label>
<select class="form-control" name="category" id="createCategory"
ng-model="createStudent.type" required>
<option value="typeValue">Category</option>
</select>
</div><br/>
<div class="row align-items-end justify-content-center">
<div class="form-group col-md-6 text-md-center">
<label for="createTeacherName">Teacher Name</label>
<input type="text" class="form-control" name="teacher"
id="createTeacherName" ng-model="createStudent.name"
placeholder="Enter Teacher Name" required>
</div>
</div><br/>
<div class="text-center pt-1">
<label>Value returned for $invalid :: {{createForm.$invalid}}</label><br/><br/>
<button type="submit" class="btn btn-info px-5" ng-click="create(createStudent)" ng-disabled="createForm.$invalid">Save</button>
</div>
</form>
Make sure all your tags are properly closed and none of your fields are empty.
I have a select box in that few values which is based on the selection i need to show the labels of the textbox.
ex: if you selected
the SE means I need to show the Location2 and Reporting To label box.
If you are selecting MANAger means need to show only Location2 label text
box only. And if you are selecting ADM/cluster, any one from this means need to be display only Location alone.
Js file
$scope.ChangeRole = function(id){
roleid=$scope.Role;
if(id=="2"){
// alert(id);
$scope.showreport =true;
$scope.showreportlocation=true;
$scope.showlocation = false;
}else if(id=="3"){
$scope.showreportlocation = true;
$scope.showreport = false;
$scope.showlocation = false;
}else{
$scope.showreport = false;
$scope.showreportlocation = false;
$scope.showlocation = true;
}
}
HTML file
<div class="col-lg-6">
<div class="form-group">
<label>Role<span style="color:red">*</span></label>
<div class="input-group role">
<select placeholder="Role" ng-model="Role" class="form-control pull-right" ng-change="ChangeRole(Role);" required ng-init="selectedType()" id="selectType"" name="role" required>
<option value="0">Role</option>
<option value="1">ADM</option>
<option value="2">SE</option>
<option value="3">MANA</option>
<option value="4">ClUSTER</option>
</select>
<div class="input-group-addon">
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="form-group" ng-show="showlocation">
<label>Location<span style="color:red">*</span></label>
<div class="input-group location">
<select id="LocationInput" class="form-control" ng-model="LocationId" ng-options="location.Id as location.NameoftheLocation for location in locations" required>
<option id="OptionInput" value="">Location</option>
</select>
<div class="input-group-addon">
</div>
</div>
</div>
</div>
<div class="col-md-6" ng-show="showreportlocation">
<div class="form-group">
<label>Location2<span style="color:red">*</span></label>
<div class="input-group site">
<select data-placeholder="Location" style="width: 100%;" ui-select2="select2Options" class="form-group" multiple ng-model="selectedTags" required>
<option ng-repeat="tag in tags" value="{{tag.Id}}">{{tag.NameoftheLocation}}</option>
</select>
<div class="input-group-addon">
<i class="fa fa-map"></i>
</div>
</div>
</div>
</div>
<div class="col-lg-6" id="otherType" ng-show="showreport">
<div class="form-group">
<label>Reporting To<span style="color:red">*</span></label>
<div class="input-group">
<select class="form-control" id="reportingto" name="reportingto" ng-options="n.Id as n.Name for n in names" ng-model="ReportingTo" required>
<option value="">Reporting To</option>
</select>
<div class="input-group-addon">
</div>
</div>
</div>
</div>
Here I have given the required option for all but which is not allowing me to save because required is present.
Using ng-show for particular selection I hide that label, but while saving html will check that field also, which is wrong please let me know that how to do.
Please some make the fiddle and let me know,
Use ng-required instead and only require it when it is shown.
I also tested Casey's suggestion of using ng-if instead of ng-show and that works as well. https://plnkr.co/edit/eeKvz5zRFeuLSF6fDbuy?p=preview
I have a problem with 'select' when I choose an option in 1st 'select' I don't see the result in same time in the 2nd 'select', I must refresh the page manually with 'F5' so I can see the results.
add_parcelle.html
<div class="row">
<div class="col-md-12">
<div class="form-group" ng-class="{'has-error':Form.type.$dirty && Form.type.$invalid, 'has-success':Form.type.$valid}">
<label for="form-field-select-2">
Type de la parcelle <span class="symbol required"></span>
</label>
<select name="type" ng-model="type" title="select" class="cs-select cs-skin-elastic" ng-change="sendType(Form.type.$modelValue)" required>
<option value="" disabled selected>Selectionnez un type</option>
<option value="Lot">Lot</option>
<option value="Parcelle">Parcelle</option>
<option value="Zone">Zone</option>
<option value="Plant">Plant</option>
</select>
<span class="error text-small block" ng-if="Form.type.$dirty && Form.type.$invalid">Champ bligatoire</span>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group" ng-class="{'has-error':Form.idParcelle.$dirty && Form.idParcelle.$invalid, 'has-success':Form.idParcelle.$valid && Form.idParcelle.$dirty}">
<label for="form-field-select-2">
Parent de la parcelle <span class="symbol required"></span>
</label>
<select data-ng-init="showParents()" name="idParcelle" ng-model="idParcelle" title="select" class="cs-select cs-skin-elastic">
<option value="" disabled selected>Selectionnez un parent</option>
<option value="1">Aucun parent</option>
<option ng-repeat="p in parcelle" value="{{p.idParcelle}}"><div ng-if="p.parent.libelle">{{p.libelle}}</div></option>
</select>
<span class="error text-small block" ng-if="Form.idParcelle.$dirty && Form.idParcelle.$invalid">Champ bligatoire</span>
</div>
</div>
</div>
ParcelleController.js
$scope.sendType= function(type){
$sessionStorage.typeParc=type;
console.log($sessionStorage.typeParc);
};
$scope.showParents = function() {
if($sessionStorage.typeParc=='Parcelle')
$scope.showLots();
else if($sessionStorage.typeParc=='Zone')
$scope.showParcels();
else if($sessionStorage.typeParc=='Plant')
$scope.showZones();
};
In 1st 'Select' I use:
ng-change="sendType(Form.type.$modelValue)"
so I can store the Form.type and use it in function showParents() that show the result in 2nd 'Select'
data-ng-init="showParents()"
So, this is my problem!!
thanks in advance :)
after edit of 'Gustavo Gabriel'
this is the result:
enter image description here
I don't see the list in 'select' but I see it in console :p
In the first select modify your ng-change to:
ng-change="sendType(Form.type.$modelValue); showParents();"
Hope it helps =)
I have a Angular modal that has Angular-UI tabs. The input fields outside the tabs POST fine, Input fields inside the tabs are not. However I use the same modal for PUT and that modal updates the DB with new data. Is this a scope issue?
<fieldset>
<div class="col-xs-12">
#*<label style="">Hide: </label>
<input style="" ng-model="currentItem.JobHidden" type="checkbox">*#
<div class="inline-fields">
<h4 style="margin-left:24px">Job Info Customer Info</h4>
<label style="margin-left:23px">Number:</label>
<input style="width:100px" ng-model="JobNumber" type="text">
<label style="margin-left:115px">Customer:</label>
<input style="width:150px" type="text" ng-model="CustomerName"
typeahead="customer.CustomerName for customer in customerArray | filter:$viewValue"
placeholder="Enter Customer" typeahead-on-select="selectNewCustomer($item)">
</div>
<div class="inline-fields">
<label style="margin-left:33px">Status:</label>
<select style="width: 100px" ng-model="JobStatus">
<option disabled>Select</option>
<option value="Active">Active</option>
<option value="InActive">InActive</option>
<option value="Complete">Complete</option>
</select>
<label style="margin-left:125px">Address:</label>
<input style="width:200px" ng-model="CustomerAddress" type="text">
</div>
<div class="inline-fields">
<label style="margin-left:38px">Name:</label>
<input style="width:150px" ng-model="JobName" type="text">
<label style="margin-left:104px">City:</label>
<input style="width: 66px" ng-model="CustomerCity" type="text">
<label>St:</label>
<input style="width: 30px" ng-model="CustomerState" type="text">
<label>Zip:</label>
<input style="width: 44px" ng-model="CustomerZipcode" type="text">
</div>
<div class="inline-fields">
<label style="margin-left:20px">Address:</label>
<input style="width:185px" ng-model="JobAddress" type="text">
<label style="margin-left:78px">Ph:</label>
<input style="width: 100px; " ng-model="CustomerPhoneNumber" type="text">
<label style="margin-left:0px">Fax:</label>
<input style="width: 89px" ng-model="CustomerFaxNumber" type="text">
</div>
<div class="inline-fields">
<label style="margin-left:49px">City:</label>
<input style="width:66px" ng-model="JobCity" type="text">
<label>St:</label>
<input style="width:30px" ng-model="JobState" type="text">
<label>Zip:</label>
<input style="width:44px" ng-model="JobZipcode" type="text">
</div>
<div class="inline-fields">
<label style="margin-left:58px">Ph:</label>
<input style="width:100px" ng-model="JobPhoneNumber" type="text">
<label>Fax:</label>
<input style="width:89px" ng-model="JobFaxNumber" type="text">
</div>
<div class="inline-fields">
<label style="margin-left:55px">PM:</label>
<select style="width:138px" ng-options="employee.EmployeeFirstName + ' ' + employee.EmployeeLastName as employee.EmployeeFirstName + ' ' + employee.EmployeeLastName for employee in employeeArray | filter:{EmployeeIsPM : true}" ng-model="JobTESPM">
<option value="" disabled>Select</option>
</select>
</div>
</div>
</fieldset><br />
<!--Cover Content-->
<tabset>
<tab heading="Contract">
<div class="col-xs-12" style="margin-top:10px">
<div class="inline-fields">
<label style="margin-left:13px">Original Contract:</label>
<input style="width:115px" ng-model="JobOriginalContract" type="text" format="number">
<label style="margin-left:57px">Geo Area:</label>
<select style="width: 115px" ng-model="JobGeoArea">
<option disabled>Select</option>
<option value="JobGeoArea-1">JobGeoArea-1</option>
<option value="JobGeoArea-2">JobGeoArea-2</option>
</select>
</div>
<div class="inline-fields">
<label style="margin-left:69px">Total CO:</label>
<input style="width:115px" ng-model="JobTotalCO" type="text" format="number">
<label style="margin-left:82px">Job Class:</label>
<select style="width: 115px; " ng-model="JobClass">
<option disabled>Select</option>
<option value="JobClass-1">JobClass-1</option>
<option value="JobClass-2">JobClass-2</option>
</select>
</div>
<div class="inline-fields">
<label style="margin-left:11px">Revised Contract:</label>
<input style="width:115px" ng-model="JobRevisedContract" type="text" format="number">
<label style="margin-left:55px">Min Wage:</label>
<select style="width:90px" ng-model="JobMinWage">
<option disabled>Select</option>
<option value="1000">$1000</option>
<option value="2000">$2000</option>
</select>
<label style="margin-left:0px">Job Type:</label>
<select style="width: 90px" ng-model="JobType">
<option disabled>Select</option>
<option value="JobType-1">JobType</option>
<option value="JobType-2">JobType</option>
</select>
</div>
<div class="inline-fields">
<label style="margin-left:59px">Retainage:</label>
<select style="width:115px" ng-model="JobRetainage">
<option disabled>Select</option>
<option value="JobRetainage-1">JobRetainage-1</option>
<option value="JobRetainage-2">JobRetainage-2</option>
<option value="JobRetainage-3">JobRetainage-3</option>
</select>
<label style="margin-left:42px">Tax Exempt:</label>
<select style="width: 115px" ng-model="JobTaxExempt">
<option disabled>Select</option>
<option value="true">True</option>
<option value="false">False</option>
</select>
</div>
<div class="inline-fields">
<label style="margin-left:21px">Original Budget:</label>
<input style="width:115px" ng-model="JobOriginalBudget" type="text" format="number">
<label style="margin-left:39px">Ins Program:</label>
<select style="width: 115px" ng-model="JobInsProgram">
<option disabled>Select</option>
<option value="JobInsProgram-1">JobInsProgram-1</option>
<option value="JobInsProgram-2">JobInsProgram-2</option>
<option value="JobInsProgram-3">JobInsProgram-3</option>
</select>
</div>
</div><!--End col-xs-12-->
</tab><!--End Contract Tab-->
<tab heading="Contacts">Contacts go here</tab>
<tab heading="Document Distribution">Document Distribution go here</tab>
</tabset><!--End Tab Content-->
<div class="col-xs-12">
<input style="margin-left:345px;width:70px;margin-right:20px;margin-top:25px" ng-click="printNewJobModal(currentItem)" type="button" value="Print" go-click="#" />
<input style="margin-right: 20px; width: 70px; margin-top: 25px" type="submit" value="Save" go-click="#" />
<input style="width: 70px; margin-top: 25px" type="button" data-dismiss="modal" value="Exit" go-click="#" />
</div>
//New Job Modal
$scope.NewJobModal = function () {
$ekathuwa.modal({
id: "NewJobModal", contentStyle: "width:800px;heigth:400px",
scope: $scope,
templateURL: "ModalNewJob"
});
}
//Post New Job
$scope.submitJob = function () {
var data = {
JobId: $scope.JobId,
JobNumber: $scope.JobNumber,
JobName: $scope.JobName,
JobDescription: $scope.JobDescription,
JobOriginalContract: $scope.JobOriginalContract,
JobBillingDate: $scope.JobBillingDate,
JobTotalCO: $scope.JobTotalCO,
JobRevisedContract: $scope.JobRevisedContract,
JobOriginalBudget: $scope.JobOriginalBudget,
JobBillingForm: $scope.JobBillingForm,
JobTESPM: $scope.JobTESPM,
JobTESSuperintendent: $scope.JobTESSuperintendent,
JobStatus: $scope.JobStatus,
JobMoreShit: $scope.JobMoreShit,
JobHidden: $scope.JobHidden,
JobTaxExempt: $scope.JobTaxExempt,
JobCertPayroll: $scope.JobCertPayroll,
JobCost: $scope.JobCost,
JobRemainingBudget: $scope.JobRemainingBudget,
JobProfit: $scope.JobProfit,
JobPercentage: $scope.JobPercentage,
JobTotalBilled: $scope.JobTotalBilled,
JobBalanceToBill: $scope.JobBalanceToBill,
JobBalanceDue: $scope.JobBalanceDue,
JobAddress: $scope.JobAddress,
JobCity: $scope.JobCity,
JobState: $scope.JobState,
JobZipcode: $scope.JobZipcode,
JobCounty: $scope.JobCounty,
JobPhoneNumber: $scope.JobPhoneNumber,
JobFaxNumber: $scope.JobFaxNumber,
JobGeoArea: $scope.JobGeoArea,
JobClass: $scope.JobClass,
JobType: $scope.JobType,
JobMinWage: $scope.JobMinWage,
JobInsProgram: $scope.JobInsProgram,
CustomerName: $scope.CustomerName,
CustomerPhoneNumber: $scope.CustomerPhoneNumber,
CustomerFaxNumber: $scope.CustomerFaxNumber,
CustomerAddress: $scope.CustomerAddress,
CustomerCity: $scope.CustomerCity,
CustomerState: $scope.CustomerState,
CustomerZipcode: $scope.CustomerZipcode,
CustomerWebsite: $scope.CustomerWebsite,
CustomerOtherShit: $scope.CustomerOtherShit,
CustomerHidden: $scope.CustomerHidden,
CustomerPM: $scope.CustomerPM,
CustomerAdmin: $scope.CustomerAdmin,
CustomerAccountant: $scope.CustomerAccountant,
CustomerSuperintendent: $scope.CustomerSuperintendent
}
$http.post('/api/apiJob/PostNewJob', data).success(function (data, status, headers) {
console.log(data); window.top.location.reload();
});
Updated Controller
//Post New Job
$scope.submitJob = function () {
var data = {
JobId: $scope.JobId,
JobNumber: $scope.JobNumber,
JobName: $scope.JobName,
JobDescription: $scope.JobDescription,
JobOriginalContract: $scope.JobOriginalContract.Value,
JobBillingDate: $scope.JobBillingDate,
JobTotalCO: $scope.JobTotalCO.Value,
JobRevisedContract: $scope.JobRevisedContract.Value,
JobOriginalBudget: $scope.JobOriginalBudget.Value,
JobBillingForm: $scope.JobBillingForm,
JobTESPM: $scope.JobTESPM,
JobTESSuperintendent: $scope.JobTESSuperintendent,
JobStatus: $scope.JobStatus,
JobMoreShit: $scope.JobMoreShit,
JobHidden: $scope.JobHidden,
JobTaxExempt: $scope.JobTaxExempt.Value,
JobCertPayroll: $scope.JobCertPayroll,
JobCost: $scope.JobCost,
JobRemainingBudget: $scope.JobRemainingBudget,
JobProfit: $scope.JobProfit,
JobPercentage: $scope.JobPercentage,
JobTotalBilled: $scope.JobTotalBilled,
JobBalanceToBill: $scope.JobBalanceToBill,
JobBalanceDue: $scope.JobBalanceDue,
JobAddress: $scope.JobAddress,
JobCity: $scope.JobCity,
JobState: $scope.JobState,
JobZipcode: $scope.JobZipcode,
JobCounty: $scope.JobCounty,
JobPhoneNumber: $scope.JobPhoneNumber,
JobFaxNumber: $scope.JobFaxNumber,
JobGeoArea: $scope.JobGeoArea.Value,
JobClass: $scope.JobClass.Value,
JobType: $scope.JobType.Value,
JobMinWage: $scope.JobMinWage.Value,
JobInsProgram: $scope.JobInsProgram.Value,
CustomerName: $scope.CustomerName,
CustomerPhoneNumber: $scope.CustomerPhoneNumber,
CustomerFaxNumber: $scope.CustomerFaxNumber,
CustomerAddress: $scope.CustomerAddress,
CustomerCity: $scope.CustomerCity,
CustomerState: $scope.CustomerState,
CustomerZipcode: $scope.CustomerZipcode,
CustomerWebsite: $scope.CustomerWebsite,
CustomerOtherShit: $scope.CustomerOtherShit,
CustomerHidden: $scope.CustomerHidden,
CustomerPM: $scope.CustomerPM,
CustomerAdmin: $scope.CustomerAdmin,
CustomerAccountant: $scope.CustomerAccountant,
CustomerSuperintendent: $scope.CustomerSuperintendent
}
$http.post('/api/apiJob/PostNewJob', data).success(function (data, status, headers) {
console.log(data); window.top.location.reload();
});
};
Updated View
<tab heading="Contract">
<div class="col-xs-12" style="margin-top:10px">
<div class="inline-fields">
<label style="margin-left:13px">Original Contract:</label>
<input style="width:115px" ng-model="JobOriginalContract.Value" type="text" format="number">
<label style="margin-left:57px">Geo Area:</label>
<select style="width: 115px" ng-model="JobGeoArea.Value">
<option disabled>Select</option>
<option value="JobGeoArea-1">JobGeoArea-1</option>
<option value="JobGeoArea-2">JobGeoArea-2</option>
</select>
</div>
<div class="inline-fields">
<label style="margin-left:69px">Total CO:</label>
<input style="width:115px" ng-model="JobTotalCO.Value" type="text" format="number">
<label style="margin-left:82px">Job Class:</label>
<select style="width: 115px; " ng-model="JobClass.Value">
<option disabled>Select</option>
<option value="JobClass-1">JobClass-1</option>
<option value="JobClass-2">JobClass-2</option>
</select>
</div>
<div class="inline-fields">
<label style="margin-left:11px">Revised Contract:</label>
<input style="width:115px" ng-model="JobRevisedContract.Value" type="text" format="number">
<label style="margin-left:55px">Min Wage:</label>
<select style="width:90px" ng-model="JobMinWage.Value">
<option disabled>Select</option>
<option value="1000">$1000</option>
<option value="2000">$2000</option>
</select>
<label style="margin-left:0px">Job Type:</label>
<select style="width: 90px" ng-model="JobType.Value">
<option disabled>Select</option>
<option value="JobType-1">JobType</option>
<option value="JobType-2">JobType</option>
</select>
</div>
<div class="inline-fields">
<label style="margin-left:59px">Retainage:</label>
<select style="width:115px" ng-model="JobRetainage.Value">
<option disabled>Select</option>
<option value="JobRetainage-1">JobRetainage-1</option>
<option value="JobRetainage-2">JobRetainage-2</option>
<option value="JobRetainage-3">JobRetainage-3</option>
</select>
<label style="margin-left:42px">Tax Exempt:</label>
<select style="width: 115px" ng-model="JobTaxExempt.Value">
<option disabled>Select</option>
<option value="true">True</option>
<option value="false">False</option>
</select>
</div>
<div class="inline-fields">
<label style="margin-left:21px">Original Budget:</label>
<input style="width:115px" ng-model="JobOriginalBudget.Value" type="text" format="number">
<label style="margin-left:39px">Ins Program:</label>
<select style="width: 115px" ng-model="JobInsProgram.Value">
<option disabled>Select</option>
<option value="JobInsProgram-1">JobInsProgram-1</option>
<option value="JobInsProgram-2">JobInsProgram-2</option>
<option value="JobInsProgram-3">JobInsProgram-3</option>
</select>
</div>
</div><!--End col-xs-12-->
</tab><!--End Contract Tab-->
};