I have a navigation bar with 5 elements, drop down menu field, textarea and another text field. Here are the requirements:
- Initially, all navigation bar elements except Home should be disabled when the document is ready. When the text field loses focus, the disabled attribute should be removed from them and they should be activated again.
- All values in the dropdown menu field starting with 001 should be separated and displayed in an additional drop-down menu under "Master" in the navigation bar without the URL part. Values starting with 002 should be appended to an additional drop-down menu under CSS, and values starting with 003 should be added under Javascript, both without the URL part.
- If the user clicks on the logout option under the Home window, it should close.
This is a demo: https://jsfiddle.net/ov43ebko/1/
$(document).ready(function(){
$('.css,.jscript,.jquery').attr('disabled','disabled');
$('.logOut').click(function(){
window.close();
});
// Split lines based on semicolon.
function check(){
var lines = $('.hiddenText textarea').val().split(/\n/);
var texts = [];
for (var i=0; i < lines.length; i++) {
texts.push($.trim(lines[i]));
}
for (var i=0; i < texts.length; i++) {
var removed1 = texts[i].split(';');
$(".masters").append($("<ul><li>").text(removed1[0]));
$(".css").append($("<ul><li>").text(removed1[1]));
$(".jscript").append($("<ul><li>").text(removed1[2]));
}
}
// Split dropdown menu choices into lines.
function c1() {
var resultLines = $('.filledField').find('option').size();
var textArea ="";
for (var i = 1; i <= resultLines; i++) {
var xItem = $('.filledField').find('option:nth-child(' + (i) + ')').text();
textArea += xItem ;
//code to split xItem into individual variables
}
$('.hiddenText textarea').val('');
$('.hiddenText textarea').val(textArea);
check();
}
$(".field").blur(function(){
$('.css,.jscript,.jquery').prop("disabled", false);
c1();
});
});