locked
Change the Content/Title of Button using css RRS feed

  • Question

  • User-2079686736 posted

    I have one requirement to change the button content /Title using css how i can do this ??

    Friday, October 14, 2016 7:16 AM

Answers

  • User1724605321 posted

    Hi ,

    May i know why you want to change the content of button by css ? I would suggest use some sort of client-side language (JavaScript, jQuery, etc.) or server-side language (php, ASP.NET, etc.) to achieve that. Code below is how to use jquery to change button text:

    <input type='button' value='Add' id='btnAddProfile'>
    $("#btnAddProfile").attr('value', 'Save'); //versions older than 1.6
    
    <input type='button' value='Add' id='btnAddProfile'>
    $("#btnAddProfile").prop('value', 'Save'); //versions newer than 1.6
    
    <!-- Different button types-->
    
    <button id='btnAddProfile' type='button'>Add</button>
    $("#btnAddProfile").html('Save');

    Best Regards,

    Nan Yu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, October 14, 2016 8:07 AM
  • User-691209617 posted

    Hi, K.Ajay Singh,

    you can change content in following way.

    HTML

    <input id="example-checkbox" type="checkbox">
    <label for="example" id="example">Show</label>

    CSS

    #example {
      ;
    }
    #example-checkbox {
      display: none;
    }
    #example-checkbox:checked + #example:after {
      content: "Hide";
      ;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: white;
    }


    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, October 19, 2016 6:56 PM

All replies

  • User1724605321 posted

    Hi ,

    May i know why you want to change the content of button by css ? I would suggest use some sort of client-side language (JavaScript, jQuery, etc.) or server-side language (php, ASP.NET, etc.) to achieve that. Code below is how to use jquery to change button text:

    <input type='button' value='Add' id='btnAddProfile'>
    $("#btnAddProfile").attr('value', 'Save'); //versions older than 1.6
    
    <input type='button' value='Add' id='btnAddProfile'>
    $("#btnAddProfile").prop('value', 'Save'); //versions newer than 1.6
    
    <!-- Different button types-->
    
    <button id='btnAddProfile' type='button'>Add</button>
    $("#btnAddProfile").html('Save');

    Best Regards,

    Nan Yu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, October 14, 2016 8:07 AM
  • User-691209617 posted

    Hi, K.Ajay Singh,

    you can change content in following way.

    HTML

    <input id="example-checkbox" type="checkbox">
    <label for="example" id="example">Show</label>

    CSS

    #example {
      ;
    }
    #example-checkbox {
      display: none;
    }
    #example-checkbox:checked + #example:after {
      content: "Hide";
      ;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: white;
    }


    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, October 19, 2016 6:56 PM