bcpaul 0 Newbie Poster

have a calendar with individual divs for each day. Each div has a unique ID. A modal dialog pops up when the user clicks edit image. The user can set the payable hours in the modal dialog and I want those hours that are entered in the dialog box to be set in the correct div/day of the month.

I am having trouble getting the correct id and setting the text value in the form for the corresponding day.

$list_day = day of month

Clicking on the image

This HTML loops once for each day of the month:

<td class='calendar-day' style='background-color:#BDE255' > 
$name = 'payable'.$list_day;
$calendar.="<p id = ' $name' value = '0' style= 'color:blue; margin:8px;'>TEST</p>";
<!-- dialog box below-->
<span   class='helpButton'><img id='Button' value='$name_time_in' src='/sis/classes/b_edit.png'/></span>
<div class='payableDialog'> <!-- The dialog box (hidden until clicked)-->

<span  class='payableDialog'>                               

<p Day of Month: $list_day></p> <!-- Shows the day in the dialog box -->
<div class='payableDialog'><input size = '7' name='input_payable' id = 'input_payable' type = 'text' /> </div>  <!-- user enters the payable hours in the dialog box-->
</span>

</div>

</td>      

The Javasript

$('.payableButton').each(function() {  
$.data(this, 'dialog',
  $(this).next('.payableDialog').dialog({
    autoOpen: false,  
    modal: true,  
    title: 'Enter time for this day',  
    height: 300,
    width: 350,
   // position: [200,0],  
    draggable: false  ,
    buttons: {
            // SAVE HOURS BUTTON ON DIALOG BOX
            "SAVE HOURS FOR THIS DAY": function() {
                var bValid = true;

                // if data is ok, send it to the calendar
                if ( bValid ) {

                    // THIS IS WHERE I GET STUCK setting the TEXT in the parent form.  How do I know what DAY the user clicked in so I know what text element to set??



                    $( this ).dialog( "close" );
                }
            },
            // CANCEL BUTTON ON DIALOG BOX
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        },
        // CLOSE BUTTON ON DIALOG BOX
        close: function() {
            allFields.val( "" ).removeClass( "ui-state-error" );
        }
  })
);  
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.