1

I have book management system. Now I am using switch button to indicate the book is available or not.So now the admin can choose YES or No.

What I want to achieve is
-> Let say the status of availability now is 1(YES)(available)
->Admin want to change to ZERO(NO)
->Confirm() dialog will pop up
->If admin clicked YES, the switch button will changed to YEs display
->If admin clicked CANCEL (admin do not want to make any changes) , the switch button will remain the status to NO

My problem
-> When Admin click the switch button and decided not to do any changes (Admin clicked CANCEL ) so the switch button should maintain it original value(switch button still show NO). but my code is not working in this part.The value behind is working. admin clicked YES, value set in db is 1,
but the button keep changing YES/NO responding to user clicked regardless user clicked YES/CANCEL in CONFIRM().

My question similar to this one, but somehow I am not getting it


HTML

  <div *ngIf="book.available == '1'">
                                                                        <div >
                                                                             <label class="switch switch-text switch-primary">                                           
                                                                                 <input class="switch-input" type="checkbox" checked (click)="changeAvailability(0)">                                         
                                                                                 <span class="switch-label" data-off ="No" data-on="Yes">
                                                                                 </span>
                                                                                 <span class="switch-handle"></span>
                                                                              </label>
                                                                        </div>  

                                                                    </div>  

                                                                      <div *ngIf="book.available == '0'">
                                                                        <div >
                                                                             <label class="switch switch-text switch-primary">                                           
                                                                                 <input class="switch-input" type="checkbox" checked (click)="changeAvailability(1)">                                         
                                                                                 <span class="switch-label" data-off ="No" data-on="Yes">
                                                                                 </span>
                                                                                 <span class="switch-handle"></span>
                                                                              </label>
                                                                        </div>  

</div>

CODE

changeAvailability(data) 
{   
    var x = confirm('Are you sure want to change Availability?');
    if (x) 
    {
        // if admin clicked yes, to change the availabilty, then the value is sent to post
        //this part worked for me


    }
    else 
    {       
        //User Cancelled, do not proceed
        console.log('user cancelled'); 
    }
 }

I think the CODe part is working properly. I just want something to trigger to control what the switch button should display. Some suggestion said I should reload my page so the html will read the new update value submitted by admin and siwtch button will read the new value. I have tried and it is not working. Really need some guidance

TQ.

Community
  • 1
  • 1
user3643092
  • 426
  • 1
  • 8
  • 20

0 Answers0