diff --git a/otis/src/app/cases/case-detail/case-detail.component.html b/otis/src/app/cases/case-detail/case-detail.component.html
index 0dbad7a..d65b238 100644
--- a/otis/src/app/cases/case-detail/case-detail.component.html
+++ b/otis/src/app/cases/case-detail/case-detail.component.html
@@ -124,6 +124,10 @@
             <mat-option value="Respondent">Respondent</mat-option>
           </mat-select>
         </mat-form-field>
+        <mat-form-field fxFlex>
+          <mat-label>Number</mat-label>
+          <input matInput placeholder="Number" formControlName="respondentNo" />
+        </mat-form-field>
       </div>
       <div
         fxLayout="row"
diff --git a/otis/src/app/cases/case-detail/case-detail.component.ts b/otis/src/app/cases/case-detail/case-detail.component.ts
index 884a658..3926557 100644
--- a/otis/src/app/cases/case-detail/case-detail.component.ts
+++ b/otis/src/app/cases/case-detail/case-detail.component.ts
@@ -75,6 +75,7 @@ export class CaseDetailComponent implements OnInit, AfterViewInit {
       limitationDate: '',
       filingDate: '',
       appearOnBehalfOf: '',
+      respondentNo: '',
       questionOfLaw: '',
       aorName: '',
       opposingCouncilAor: '',
@@ -149,7 +150,11 @@ export class CaseDetailComponent implements OnInit, AfterViewInit {
         ? moment(this.item.limitationDate, 'DD-MMM-YYYY').toDate()
         : '',
       filingDate: this.item.filingDate ? moment(this.item.filingDate, 'DD-MMM-YYYY').toDate() : '',
-      appearOnBehalfOf: this.item.appearOnBehalfOf,
+      appearOnBehalfOf: this.item.appearOnBehalfOf === 'Petitioner' ? 'Petitioner' : 'Respondent',
+      respondentNo:
+        this.item.appearOnBehalfOf === 'Petitioner' || this.item.appearOnBehalfOf === 'Respondent'
+          ? ''
+          : this.item.appearOnBehalfOf,
       questionOfLaw: this.item.questionOfLaw,
       aorName: this.item.aorName,
       opposingCouncilAor: this.item.opposingCouncilAor,
@@ -260,7 +265,10 @@ export class CaseDetailComponent implements OnInit, AfterViewInit {
     } else {
       this.item.filingDate = moment(formModel.filingDate).format('DD-MMM-YYYY');
     }
-    this.item.appearOnBehalfOf = formModel.appearOnBehalfOf;
+    this.item.appearOnBehalfOf =
+      formModel.appearOnBehalfOf === 'Petitioner'
+        ? 'Petitioner'
+        : formModel.respondentNo || 'Respondent';
     this.item.questionOfLaw = formModel.questionOfLaw;
     this.item.aorName = formModel.aorName;
     this.item.opposingCouncilAor = formModel.opposingCouncilAor;
@@ -361,7 +369,7 @@ export class CaseDetailComponent implements OnInit, AfterViewInit {
     const complianceDate = formValue.complianceDate
       ? moment(formValue.complianceDate).format('DD-MMM-YYYY')
       : null;
-    const complianceDone = formValue.complianceDone;
+    const complianceDone = !!formValue.complianceDone;
     const nextHearingDate = formValue.nextHearingDate
       ? moment(formValue.nextHearingDate).format('DD-MMM-YYYY')
       : null;