如何使用jquery仅显示包含某些数据的div中的标签？

Question

I am working with Spring Controller and JSP project. I have a jsp page in which I have one button which is Process and once I click that button, it shows me two radio button just below it and a Submit button as well.

And after clicking Submit button, if everything went fine, then I show like this -

Success= true 
Error= none
Data= some_data

But as you can see in my jsfiddle . When my form gets loaded after I hit the jsp url it comes like this on the browser -

Process

Success= 
Error= 
Data=

Meaning, it has Process button at the top and just below Success , Error and Data label with no values in it as we haven't passed any values yet from the controller. But it looks pretty weird for the users.

So what I did is once I click Process button - I don't show Success , Error and Data labels at all. It should be shown only after the submit button is clicked with its appropriate value in Success , Error and Data depending on what is passed from the controller.

So this is the jsfiddle which is working for me. Meaning I only see these labels whenever submit button is clicked and it has some data in it

Now what I am trying to do is, if the value of label Data is null or empty after pressing the submit button, then I don't want to show Data label at all but if the Success and Error label has some data, then I would show them. How can I do this if this is possible?

Answer 1

I believe that .hide() in jquery do not support the hide for <label> . So I would suggest to use <span> tag for your label instead the <label> tag

<span id="status">Success= ${SUCCESS}</span>

Then in your javascript , use .hide() and .show() , something similar as below:

$(document).ready(function() {

 //hide label
$('#status').hide();
$('#error').hide();
$('#data').hide();

$('.btn-primary').click(function () {
    $('.btn-primary').removeClass('currentButton')
    $(this).addClass('currentButton')
    $('form').hide()
    $("#form_" + $(this).attr('id')).show();
})

$('#submit').click(function(){

    $('#status').show();
    $('#error').show();
    $('#data').show();

});

})

an updated close enough demo