0

i try to add a placeholder on the title and description box.

I try this script already but its not working!

Hope someone can help me for the right way! 

<script type="text/javascript">
  $( document ).ready(function() {
    $('#title').attr("placeholder", "test");
    $('#description').attr("placeholder", "test");
  });
</script>



      <div id="item-post-title" class="item-post-title">
        <label class="control-label" for="title[<?php echo osc_current_user_locale(); ?>]" style="width: auto;display: inline-block;">
          <span class="required_fields">* </span>
          <?php _e('Title', 'ctg_housing'); ?>
          (<?php printf(__('max %s chars','ctg_housing'),$max_character_length_title); ?>) 
        </label> <span id="Tcounter"></span>
        <?php ItemForm::title_input('title',osc_current_user_locale(), osc_esc_html( ctg_housing_item_title() )); ?>
      </div>
      <div id="item-post-description" class="item-post-description">
        <label class="control-label" for="description[<?php echo osc_current_user_locale(); ?>]" style="width: auto;display: inline-block;">
          <span class="required_fields">* </span>
          <?php _e('Description', 'ctg_housing'); ?>
          (<?php printf(__('max %s chars','ctg_housing'),$max_character_length_description); ?>)
        </label> <span id="Dcounter"></span>
        <?php ItemForm::description_textarea('description',osc_current_user_locale(), osc_esc_html( ctg_housing_item_description() )); ?>
        <?php if(!osc_plugin_is_enabled('richedit/index.php')){ ?>
        <?php } ?>
      </div>

Thanks

Ansel Mae
  • 1
  • 3

3 Answers3

0

First check your jquery libraby included or not , if not then you can add cdn jquery by 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

OR you can use js to set placholder.(for example i added below div ).

 document.getElementById("title").placeholder = "hello";

Note: Please add js below div or in footer.

Example-

<div id="item-post-title" class="item-post-title">
        <label class="control-label" for="title[<?php echo osc_current_user_locale(); ?>]" style="width: auto;display: inline-block;">
          <span class="required_fields">* </span>
          <?php _e('Title', 'ctg_housing'); ?>
          (<?php printf(__('max %s chars','ctg_housing'),$max_character_length_title); ?>) 
        </label> <span id="Tcounter"></span>
        <?php ItemForm::title_input('title',osc_current_user_locale(), osc_esc_html( ctg_housing_item_title() )); ?>
      </div>
      <div id="item-post-description" class="item-post-description">
        <label class="control-label" for="description[<?php echo osc_current_user_locale(); ?>]" style="width: auto;display: inline-block;">
          <span class="required_fields">* </span>
          <?php _e('Description', 'ctg_housing'); ?>
          (<?php printf(__('max %s chars','ctg_housing'),$max_character_length_description); ?>)
        </label> <span id="Dcounter"></span>
        <?php ItemForm::description_textarea('description',osc_current_user_locale(), osc_esc_html( ctg_housing_item_description() )); ?>
        <?php if(!osc_plugin_is_enabled('richedit/index.php')){ ?>
        <?php } ?>
      </div>

<script type="text/javascript">
  document.getElementById("title").placeholder = "hello";
</script>

Please check this jsfiddle http://jsfiddle.net/889zepgf/

shubham715
  • 3,324
  • 1
  • 17
  • 27
  • When i add this script only nothing happens – Ansel Mae Oct 26 '17 at 04:26
  • then comment your html code and create a text field like js fiddle and then check its working or not and also share html of input field from source code(browser ) – shubham715 Oct 26 '17 at 04:29
  • i'm new in this can you explain me how? – Ansel Mae Oct 26 '17 at 04:30
  • ok no problem , first replace you div with
    and check its working or not     – shubham715 Oct 26 '17 at 04:33
  • ok remove this and add your old code ,can you show me html of your input field from source code, open your page in browser then press control+u a source code tab will open search for input field with title id or name and show me that html input field. – shubham715 Oct 26 '17 at 04:44
  • view-source:http://www.propertyadsphilippines.com/test-theme/index.php?page=item&action=item_add – Ansel Mae Oct 26 '17 at 04:47
  • see your input field id showing titleen_US and for description showing descriptionen_US, replace in jquery this id or you can add this below div – shubham715 Oct 26 '17 at 04:50
  • please upvote and accept my answer if its helpful for u :). – shubham715 Oct 26 '17 at 04:55
  • this will only work where locale is - `en_US` and not for other locales – Tushar Walzade Oct 26 '17 at 05:44
  • 1
    dont worry, replace javascript code with this or if you using jquery then $('#item-post-title input').attr("placeholder", "testg"); and accept answer and also upvote . :) @TusharWalzade – shubham715 Oct 26 '17 at 06:00
0

As I understand your code, it generates field ids dynamically as - titleen_US, descriptionen_US etc. Therefore you can't access it as - $('#title').attr("placeholder", "test"); and $('#description').attr("placeholder", "test"); in your jQuery.

And doing this is not a better solution - 

$( document ).ready(function() {
    $('#titleen_US').attr("placeholder", "test");
    $('#descriptionen_US').attr("placeholder", "test");
});

Because, your osc_current_user_locale() will return different value as per user locale and it will only work where locale is - en_US and not for other locales .

So, instead of complicating things, apply class attribute to your html inputs as - class="title" & class="description" respectively and so your jQuery code will be -

$( document ).ready(function() {
    $('.title').attr("placeholder", "test");
    $('.description').attr("placeholder", "test");
});
Tushar Walzade
  • 3,737
  • 4
  • 33
  • 56
0

Thanks for the solution! 

<script type="text/javascript">
  $( document ).ready(function() {
    $('#titleen_US').attr("placeholder", "Test Title");
  });
</script>
Ansel Mae
  • 1
  • 3