+ Start a Discussion

need to use css/bootstrap to make field mandatory on vfpage with custom message as pop up

Hi All,

I am new to UI(usage of CSS, bootstrap and jscript with VFpage)Please help me on the below issue, i want to dispaly a custom error message if user doesnt input value in the below text box and clicks the button it has to show a custom message as a pop up saying the field is a mandatory.
Can anyone please help me with the css and style code fto achieve this. below i have mentioned the sample code for the field and the button

Field code below:
<apex:outputPanel rendered="{!secQuesAns.isfreeText}">
<apex:inputTextarea id="textareview" value="{!secQuesAns.SelectedAnswer}" rows="3" styleClass="need manadatoryclass here" style="resize:none;" />

button code below:
<div class="panel-body" >
<span><a class=" btn btn-primary" onclick="submitedrec();">Submit</a></span>

actionfunction code:
<apex:actionFunction name="submitrec" action="{!submitrecord}"  > </apex:actionFunction>

custom message code
<div ><span style="color:red;"> <b>(!) All the questions in this questionnaire are mandatory,Please verify and answer all the questions required below</b></span><br/><br/><br/></div>

Best Regards,
Mohammad Yaseen