Support › Forums › Cian – HTML Template › Form Placeholder not displaying on IE
- This topic has 12 replies, 2 voices, and was last updated 8 years, 9 months ago by
CreaboxThemes.
-
AuthorPosts
-
February 11, 2015 at 6:13 am #4368
Liana
ParticipantHi,
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,
LianaFebruary 11, 2015 at 9:54 pm #4371CreaboxThemes
KeymasterHi Liana,
what version do you use?
Regards
February 11, 2015 at 9:59 pm #4372Liana
ParticipantHi,
I would never use IE 😉 But a lot of people still do. I tested it on IE9 and not appearing.
February 11, 2015 at 10:02 pm #4373CreaboxThemes
KeymasterI will revise the theme in IE and I will send you the information. I will update the theme with this problem fixed too.
Regards
February 11, 2015 at 10:07 pm #4374Liana
ParticipantThank 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,
LianaFebruary 12, 2015 at 10:01 am #4381Liana
ParticipantI 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>February 12, 2015 at 8:41 pm #4383CreaboxThemes
KeymasterHi,
I’m away from home and I can’t check it. I will back home tomorrow and I will try it.
Regards
February 16, 2015 at 3:43 am #4385Liana
ParticipantHi,
Just checking in to see if you had a change to look at the IE field issue. Thank you.
February 17, 2015 at 12:41 am #4389CreaboxThemes
KeymasterHi 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:
-
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>
-
Edit the file custom.js (in the folder js) and add the next code in the line 78:
$('input, textarea').placeholder();
Regards
February 17, 2015 at 6:56 am #4390Liana
ParticipantHi,
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).
February 17, 2015 at 9:47 am #4391CreaboxThemes
KeymasterHi Liana,
Yes, that is correct. Can you send me your url to check the code? What IE version do you use??
Regards
February 17, 2015 at 11:01 pm #4398Liana
ParticipantHi,
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!
February 17, 2015 at 11:31 pm #4399CreaboxThemes
KeymasterYour welcome 😉
-
Add the next code to the main file index.html (at the bottom with the other scripts):
-
AuthorPosts
- You must be logged in to reply to this topic.