mercredi 16 mars 2022

tick and untick checkbox with typescript Angular 2

I currently working on a school assignment to create a checkbox in a table on admin side to disable/enable the dates on the calendar for users to make booking. If the checkbox is ticked/unticked which will insert a Y/N for that particular date in the table. currently, the checkbox has to be implement in resbooking.component.ts instead of resbooking.component.html.

in the resbooking.component.html

            <ng-table #resBookingTable [config]="config" #ngTable="ng-table" [rows]="data" [columns]="columns">
            </ng-table>
in the resbooking.component.ts
// Data Table
  public columns: Array<any> = [
    .....
    { title: 'Restaurant Booking', name: 'resBooking' }
  ];

// html part of checkbox in ts file
  "resBooking": '<input #resbookChkBox id="resbookChkBox" type="checkbox" function="resbookingfn" />'


// function wrote for control the checkbox 

   if (targetTagName === "INPUT") {
      if (target.getAttribute("function") != null) {
        let functionAccessed = target.getAttribute("function");
        if (functionAccessed === "resbookingfn") {
          $('#resbookChkBox').prop("checked",true);
        }
      }
    }
    
 

I have tried many methods such as:

  1. target.setAttribute("checked","true/false/checked") // still not able to untick
  2. target.removeAttribute
  3. jquery such as $(id).prop("checked")
  4. angular ng model such as 2 way databinding Angular 2 Checkbox Two Way Data Binding

Thank you for the all the help. **I am using Angular 2 and not able to allow to upgrade.




Aucun commentaire:

Enregistrer un commentaire