Bixby: want to display two form element text-input in one input form view

Question

I want to build an input form using text-input, in which I want to display multiple text fields in one form. Making a single view having multiple text fields not providing the output.

So, would it possible to write multiple text-input in a single form or not.

Below is my code which I am trying to implement:

Action:

action (CardDetails) {   
  type(Search)    
  collect{  
    input (creditCard) {  
      type (CreditCard)  
      min (Required)   
    }   
    input (cvv) {  
      type (Cvv)  
      min (Required)  
    }  
  }  
 output (getCardInfo)  
}

Structure:

structure (getCardInfo){
  property (creditCard) {
    type (CreditCard)
    min (Optional)
  }
  property (cvv) {
    type (Cvv)
    min (Optional)
  }
}

Input View:

input-view {
  match {
   CreditCard (creditCard) { 
     to-input: CardDetails
   }
 }
 message {
   template ("Enter Card Details")
 }
 render {
   form {
     elements {
       text-input {
         id (creditCard)
         label (Credit Card)
         type (CreditCard)
         max-length (20)
         value ("#{raw(creditCard)}")
       }
       text-input {
         id (cvv)
         label (cvv)
         type (Cvv)
         max-length (4)
       }
     }
     on-submit {
       goal: CardDetails
       value: viv.core.FormElement(creditCard)
       value: viv.core.FormElement(cvv)
     }
     submit-button (Ok)
  }
 }
}

Result View :

result-view {
  match: getCardInfo(res){
    from-output : CardDetails
  }
  message{
     template ("Here are the details")
  }
}

Unable to display result view. Showing I need CVV details to continue.

Any Help on this, Please

score 1 · Answer 1 · answered Apr 29 '20 at 17:59

I am sure there are other ways, but the easiest way I could think of is to do input-view on the structure. Also it might be just personal style, but I would recommend change the naming, actions should start with something like Get or Create, not the structure name.

input-view {
  match: StructCard(this) 
  message: template ("Give me your card") 
  render {
    form {
      elements {
        text-input {
          id (aaa) 
          label("Card Number")
          type (TextCardNumber)
          value("Costco Citi")
        }
        text-input {
          id (bbb) 
          label("Card CVV")
          type (TextCardCvv)
          value("No WAY")
        }
      }
      on-submit {
        goal: StructCard
        value: StructCard {
          cardNumber: viv.core.FormElement(aaa)
          cardCvv: viv.core.FormElement(bbb)
        }
      }
    }
  }
}

There are other minor but subtle changes to the action, check the complete example on GitHub. Utterance "tell me your card".

Here is the input-view

Here is the result-view

Bixby: want to display two form element text-input in one input form view

1 Answers1