javascript - Need to hide a selected element based on conditions -
i have drop down menu various options
- new
- in progress
- ordered
- not ordered
- completed
- cancelled
i have form need hide eta row when status new, enable other status. tried:
var progress, ordered, unordered, completed, cancelled, reg, high, user, trimuser, etadate, etarow, etahour, etaminutes; function initiate() { //declaring necessary variables declaration() } function declaration(){ //declaration of variables status changes snew = $("option[value='new']"); progress = $("option[value='in progress']"); ordered = $("option[value='ordered']"); unordered = $("option[value='unordered']"); completed = $("option[value='completed']"); cancelled = $("option[value='cancelled']"); //declaring variables priority changes reg = $('input[value="ctl00"]'); high = $('input[value="ctl01"]'); //declaring current user using spservices user = $().spservices.spgetcurrentuser({ fieldname: "name", debug: false }); //declaring variables eta field manipulation etarow = $("nobr").filter(function () { return $.trim(this.childnodes[0].nodevalue) === "eta"; }).closest("tr"); etadate = $('input[title="eta"]'); etahour = $("[id$=datetimefielddatehours]"); etaminutes = $("[id$=datetimefielddateminutes]"); } function hideeta(){ //hide eta options etarow.hide(); if(snew.not(:checked)){ alert('cp1'); eta.show(); } }
so way tried hiding (because new default), when it's new, show it.
edit: think have solved, how did after @richard if statement , selectors:
function seteta(){ //hide, display , disable eta based on stages if(snew.is(":checked")){ etarow.hide(); }else if (progress.is(":checked")){ //do nothing, should showing }else{ etadate.attr("readonly","true").css('background-color','#f6f6f6'); etahour.attr("disabled","disabled"); etaminutes.attr("disabled","disabled"); } }
2 possibility:
- display = none
- remove option
for display method: http://jsfiddle.net/r7glu/1/
// hide option var opt = $('option[value=new]'); opt.css('display','none'); if( opt.parent().val() == 'new' ) opt.next().attr("selected", "selected"); // show option var opt = $('option[value=new]'); opt.css('display','');
Comments
Post a Comment