Form Placeholder not displaying on IE

Support Forums Cian – HTML Template Form Placeholder not displaying on IE

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #4368
    Liana
    Participant

    Hi,

    The form placeholder (eg. First Name) doesn’t appear on Internet Explorer. It just shows the field blank. How do I fix this?

    Thanks in advance,
    Liana

    #4371
    CreaboxThemes
    Keymaster

    Hi Liana,

    what version do you use?

    Regards

    #4372
    Liana
    Participant

    Hi,

    I would never use IE 😉 But a lot of people still do. I tested it on IE9 and not appearing.

    #4373
    CreaboxThemes
    Keymaster

    I will revise the theme in IE and I will send you the information. I will update the theme with this problem fixed too.

    Regards

    #4374
    Liana
    Participant

    Thank you. Do you have an ETA on this as my site is already live? Also, could you let me know the code you change as I would just like to fix this problem, not update the whole theme.

    Thank you,
    Liana

    #4381
    Liana
    Participant

    I added this code and it worked, however it gets rid of the validation check on IE. i.e users can just press enter and it will submit. How can I make the validation check work with IE?

    <!– Placeholder IE fix –>
    <script type=”text/javascript”>
    /* <![CDATA[ */
    $(function() {
    var input = document.createElement(“input”);
    if((‘placeholder’ in input)==false) {
    $(‘[placeholder]’).focus(function() {
    var i = $(this);
    if(i.val() == i.attr(‘placeholder’)) {
    i.val(”).removeClass(‘placeholder’);
    if(i.hasClass(‘password’)) {
    i.removeClass(‘password’);
    this.type=’password’;
    }
    }
    }).blur(function() {
    var i = $(this);
    if(i.val() == ” || i.val() == i.attr(‘placeholder’)) {
    if(this.type==’password’) {
    i.addClass(‘password’);
    this.type=’text’;
    }
    i.addClass(‘placeholder’).val(i.attr(‘placeholder’));
    }
    }).blur().parents(‘form’).submit(function() {
    $(this).find(‘[placeholder]’).each(function() {
    var i = $(this);
    if(i.val() == i.attr(‘placeholder’))
    i.val(”);
    })
    });
    }
    });
    /* ]]> */
    </script>

    #4383
    CreaboxThemes
    Keymaster

    Hi,

    I’m away from home and I can’t check it. I will back home tomorrow and I will try it.

    Regards

    #4385
    Liana
    Participant

    Hi,

    Just checking in to see if you had a change to look at the IE field issue. Thank you.

    #4389
    CreaboxThemes
    Keymaster

    Hi Liana,

    sorry for the delay. I have found a possible solution. Download this file and upload it to the folder js. Then, follow these steps:

    1. Add the next code to the main file index.html (at the bottom with the other scripts):
      <script type="text/javascript" src="js/jquery.placeholder.js"></script></ol>
    2. Edit the file custom.js (in the folder js) and add the next code in the line 78:
      $('input, textarea').placeholder();

    Regards

    #4390
    Liana
    Participant

    Hi,

    That didn’t seem to work.

    I added the custom.js code after this line:
    jQuery(‘body’).scrollspy({ offset: 300,target: ‘nav’ })

    Is that correct?

    The code I pasted in my previous post works (shows the field names), however it gets rid of the validation. This code you sent didn’t show the field names (shows text fields as blank).

    #4391
    CreaboxThemes
    Keymaster

    Hi Liana,

    Yes, that is correct. Can you send me your url to check the code? What IE version do you use??

    Regards

    #4398
    Liana
    Participant

    Hi,

    Your code actually worked and the problem seems to be on my end as I tested it on your demo and fields now come up.

    I will have to look into it further on my end.

    Thanks for all your help!

    #4399
    CreaboxThemes
    Keymaster

    Your welcome 😉

Viewing 13 posts - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.