Fix device-type features edit issue

3.x.x
Turcy 5 years ago
parent 6f21f472b6
commit f28d42d7ce

@ -98,14 +98,15 @@
<div class="row"> <div class="row">
<div class="dontfloat feature-wrapper" name ="deviceFeature"> <div class="dontfloat feature-wrapper" name ="deviceFeature">
<div class="col-xs-3"> <div class="col-xs-3">
<input type="text" class="form-control" id="feature-name" placeholder="name" value="{{this.name}}"/> <input type="text" class="form-control feature-name" placeholder="name" value="{{this.name}}"/>
</div> </div>
<div class="col-xs-4"> <div class="col-xs-4">
<input type="text" class="form-control" id="feature-code" placeholder="code" value="{{this.code}}"/> <input type="text" class="form-control feature-code" placeholder="code" value="{{this.code}}"/>
</div> </div>
<div class="col-xs-4"> <div class="col-xs-4">
<textarea aria-describedby="basic-addon1" type="text" id="feature-description" <textarea aria-describedby="basic-addon1" type="text"
placeholder="description" data-error-msg="invalid feature description" class="form-control" rows="1" cols="30">{{this.description}}</textarea> placeholder="description" data-error-msg="invalid feature description"
class="form-control feature-description" rows="1" cols="30">{{this.description}}</textarea>
</div> </div>
<button type="button" class="wr-btn wr-btn-horizontal remove_feature_button"><i class="fa fa-minus"></i></button> <button type="button" class="wr-btn wr-btn-horizontal remove_feature_button"><i class="fa fa-minus"></i></button>
</div> </div>
@ -115,16 +116,16 @@
<div class="row"> <div class="row">
<div class="dontfloat feature-wrapper" name="deviceFeature"> <div class="dontfloat feature-wrapper" name="deviceFeature">
<div class="col-xs-3"> <div class="col-xs-3">
<input type="text" class="form-control" id="feature-name" placeholder="name"/> <input type="text" class="form-control feature-name" placeholder="name"/>
</div> </div>
<div class="col-xs-4"> <div class="col-xs-4">
<input type="text" class="form-control" id="feature-code" placeholder="code"/> <input type="text" class="form-control feature-code" placeholder="code"/>
</div> </div>
<div class="col-xs-4"> <div class="col-xs-4">
<textarea aria-describedby="basic-addon1" type="text" id="feature-description" <textarea aria-describedby="basic-addon1" type="text"
placeholder="description" placeholder="description"
data-error-msg="invalid feature description" data-error-msg="invalid feature description"
class="form-control" rows="1" cols="30"></textarea> class="form-control feature-description" rows="1" cols="30"></textarea>
</div> </div>
<button type="button" class="wr-btn wr-btn-horizontal add_feature_button"><i class="fa fa-plus"></i></button> <button type="button" class="wr-btn wr-btn-horizontal add_feature_button"><i class="fa fa-plus"></i></button>
</div> </div>
@ -221,7 +222,7 @@
</div> </div>
<br> <br>
<button id="add-devicetype-btn" class="wr-btn">Update</button> <button id="edit-devicetype-btn" class="wr-btn">Update</button>
<div id="devicetype-create-success-msg" class="alert hidden" role="alert"> <div id="devicetype-create-success-msg" class="alert hidden" role="alert">
<i class="icon fw fw-success"></i><span></span> <i class="icon fw fw-success"></i><span></span>
</div> </div>
@ -268,4 +269,4 @@
{{#zone "bottomJs"}} {{#zone "bottomJs"}}
{{js "js/bottomJs.js"}} {{js "js/bottomJs.js"}}
{{/zone}} {{/zone}}

@ -123,27 +123,28 @@ $(document).ready(function () {
var addFeatureButton = $('.add_feature_button'); //Add button selector var addFeatureButton = $('.add_feature_button'); //Add button selector
var featureWrapper = $('.feature_field_wrapper'); //Input field wrapper var featureWrapper = $('.feature_field_wrapper'); //Input field wrapper
$(addFeatureButton).click(function(){ //Once add button is clicked $(addFeatureButton).click(function(){ //Once add button is clicked
var featureFieldHtml = '<div class="row"><div class="dontfloat feature-wrapper" name ="deviceFeature"> <div class="col-xs-3"> <input type="text"' + var featureFieldHtml = '<div class="row"><div class="dontfloat feature-wrapper" name ="deviceFeature"> ' +
' class="form-control" id="feature-name" placeholder="name"/> </div> <div class="col-xs-4"> ' + '<div class="col-xs-3"> <input type="text"' +
'<input type="text" class="form-control" id="feature-code" placeholder="code"/> </div> ' + ' class="form-control feature-name" placeholder="name"/> </div> <div class="col-xs-4"> ' +
'<div class="col-xs-4"> <textarea aria-describedby="basic-addon1" type="text" ' + '<input type="text" class="form-control feature-code" placeholder="code"/> </div> ' +
'id="feature-description" placeholder="description"data-error-msg="invalid ' + '<div class="col-xs-4"> <textarea aria-describedby="basic-addon1" type="text" ' +
'feature description"class="form-control" rows="1" cols="30"></textarea> </div> ' + 'class="feature-description" placeholder="description"data-error-msg="invalid ' +
'<button type="button" class="wr-btn wr-btn-horizontal wr-btn-secondary remove_feature_button"><i class="fa fa-minus"></i></button> </div></div>' 'feature description" class="form-control" rows="1" cols="30"></textarea> </div> ' +
'<button type="button" class="wr-btn wr-btn-horizontal wr-btn-secondary remove_feature_button">' +
'<i class="fa fa-minus"></i></button> </div></div>';
$(featureWrapper).append(featureFieldHtml); // Add field html $(featureWrapper).append(featureFieldHtml); // Add field html
}); });
$(featureWrapper).on('click', '.remove_feature_button', function(e){ //Once remove button is clicked $(featureWrapper).on('click', '.remove_feature_button', function(e){ //Once remove button is clicked
e.preventDefault(); e.preventDefault();
$(this).parent('div').remove(); //Remove field html $(this).parent('div').remove(); //Remove field html
op--; //Decrement field counter
}); });
/** /**
* Following click function would execute * Following click function would execute
* when a user clicks on "Add Device type" button. * when a user clicks on "Add Device type" button.
*/ */
$("button#add-devicetype-btn").click(function () { $("button#edit-devicetype-btn").click(function () {
var errorMsgWrapper = "#devicetype-create-error-msg"; var errorMsgWrapper = "#devicetype-create-error-msg";
var errorMsg = "#devicetype-create-error-msg span"; var errorMsg = "#devicetype-create-error-msg span";
@ -155,13 +156,19 @@ $(document).ready(function () {
if (!deviceTypeName || deviceTypeName.trim() == "" ) { if (!deviceTypeName || deviceTypeName.trim() == "" ) {
$(errorMsg).text("Device Type Name Cannot be empty."); $(errorMsg).text("Device Type Name Cannot be empty.");
$(errorMsgWrapper).removeClass("hidden"); $(errorMsgWrapper).removeClass("hidden");
$([document.documentElement, document.body]).animate({
scrollTop: $(".page-sub-title").offset().top
}, 500);
return; return;
} }
if (!deviceTypeDescription || deviceTypeDescription.trim() == "" ) { if (!deviceTypeDescription || deviceTypeDescription.trim() == "") {
$(errorMsg).text("Device Type Description Cannot be empty."); $(errorMsg).text("Device Type Description Cannot be empty.");
$(errorMsgWrapper).removeClass("hidden"); $(errorMsgWrapper).removeClass("hidden");
return $([document.documentElement, document.body]).animate({
scrollTop: $(".page-sub-title").offset().top
}, 500);
return;
} }
deviceType.name = deviceTypeName.trim(); deviceType.name = deviceTypeName.trim();
@ -197,17 +204,29 @@ $(document).ready(function () {
} }
var features = []; var features = [];
var featureCodesValidation = true;
var regexp = /^[a-zA-Z0-9-_]+$/;
$('div[name^="deviceFeature"]').each(function() { $('div[name^="deviceFeature"]').each(function() {
var featureName = $(this).find("#feature-name").val(); var featureName = $(this).find(".feature-name").val();
var featureCode = $(this).find("#feature-code").val(); var featureCode = $(this).find(".feature-code").val();
if (featureName && featureName.trim() != "" && featureCode && featureCode.trim() != "") { var featureDescription = $(this).find(".feature-description").val();
var feature = {}; if (featureName && featureName.trim() != "" && featureCode && featureCode.trim() != "") {
feature.name = featureName.trim(); featureCodesValidation = featureCodesValidation && (featureCode.search(regexp) != -1);
feature.code = featureCode.trim(); var feature = {};
feature.description = $("#feature-description").val(); feature.name = featureName.trim();
features.push(feature); feature.code = featureCode.trim();
} feature.description = featureDescription;
features.push(feature);
}
}); });
if (!featureCodesValidation) {
$(errorMsg).text("Device Type feature code can only contain alphanumeric, underscore and dash characters.");
$(errorMsgWrapper).removeClass("hidden");
$([document.documentElement, document.body]).animate({
scrollTop: $(".page-sub-title").offset().top
}, 500);
return;
}
deviceType.deviceTypeMetaDefinition.features = features; deviceType.deviceTypeMetaDefinition.features = features;
var addRoleAPI = apiBasePath + "/admin/device-types/" + deviceType.name; var addRoleAPI = apiBasePath + "/admin/device-types/" + deviceType.name;
@ -217,6 +236,7 @@ $(document).ready(function () {
deviceType, deviceType,
function (data, textStatus, jqXHR) { function (data, textStatus, jqXHR) {
if (jqXHR.status == 200) { if (jqXHR.status == 200) {
$(errorMsgIdentifier).addClass(" hidden");
$("#modalDevice").modal('show'); $("#modalDevice").modal('show');
} }
}, },
@ -234,4 +254,4 @@ $(document).ready(function () {
); );
}); });
}); });

Loading…
Cancel
Save