Jump to content

Newbie Question: In a DE form, how to retain a value in a field and display it as disabled/greyed-out?


new2you

Recommended Posts

Hello JS experts,

 

I'm new to JS coding (self-learning) and I have just one (potenitally) simple request to ask of you wonderful folks here.

 

Oh BTW, I've tried searching through this forum (and the WWW as well) but couldn't seem to easily find something that fits my request, or was easy for me to understand and apply to my situation.

 

So what I have/want is: a Data-Entry form which (for the first record/entry for a given date) allows the user to select a date from a "Calendar Date Picker".  Upon subsequent records/entries (for the same date), the date field should no longer be accessible, but the (previously entered/selected) value should be both displayed (greyed-out) and certainly carried over to the DB/Table.

 

I know this might be a very simple piece of code, but being that I'm a newbie, I'm not sure how to achieve this.

 

Would appreciate any and all help to get this done (preferably the necessary code).

 

If it helps, here's some of my existing code that's related to the field names:

 

Form field details:

                <div class="control-group">

                    <label class='control-label'>Select Flyer Start Date:</label>

                    <input type="text" name="datepicker" id="datepicker">

                </div>

DB (table) field details:

         $flyerDateStart = isset($_POST["datepicker"]) ? $_POST["datepicker"] : "";

Thanks much.

Link to comment
Share on other sites

I assume you're using JQuery Datepicker?

 

If you can use PHP on the file and get the dates server-side, your JavaScript would be somewhat simple.  You can use it on the same page and just substitue the array through PHP.  Something like this perhaps (untested):

<?php
// Get dates into a PHP variable to be used later
// $dates = .......
?>
<html>
<head>

<!-- I am not sure what JQuery version you use, or datepicker version/css so do not forget to add them here -->

<script>
$(document).ready(function() {
 
  // Substitute your dates in the var below.  If you change the format, just make sure you change the formateDate below too
  // This array will disable October 23 - October 25 of this year
 
  var date_array = ["2014-10-23","2014-10-24","2014-10-25"];  // Substitute dates i.e. var date_array = <?php echo htmlentities($dates); ?> or something
  $("#datepicker").datepicker({

    beforeShowDay: function(date) {

      // If you change date formats, change this as well
      var string = jQuery.datepicker.formatDate('yy-mm-dd', date);

      return [$.inArray(string, date_array) == -1];

    }
 
  });
 
});
</script>
</head>
<body>

<div class="control-group">

<label class='control-label'>Select Flyer Start Date:</label>

<input type="text" name="datepicker" id="datepicker">

</div>

</body>
</html>
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.