how to check whether user has filled all the values or not

Question

in my lightning component, I have one form in which fields are required but if I click on submit button record is getting saved. how can I check before submitting that all fields are filled or not?

<aura:component implements="forceCommunity:availableForAllPageTypes" access="global" controller="RE_Customcaseregistration">
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:attribute name="options" type="List"></aura:attribute>
<aura:attribute name="SelectedValue" type="String"></aura:attribute>
<aura:attribute name="NewCase" type="Case"
                default="{ 'sobjectType': 'Case',
                         'Subject': '',
                         'Description' : '',
                         'Comments':'',
                         'email__c' : ''}"/>
<lightning:card title="" class="supportblock">
    <h1 class="slds-m-top_large slds-text-heading_medium">Customer Support</h1>
    <lightning:input aura:id="inputCmp" type="text" name="input1" label="Subject" required="true" value="{!v.NewCase.Subject}"/>
    <lightning:select class="select-auto-width" aura:id="SelectPropertyRcrd" name="select" label="Select a Property" required="true" value="{!v.SelectedValue}" onchange="{!c.UpdateSelectoption}"> 
        <option value="choose">Choose one...</option> 
        <aura:iteration items="{!v.options}" var="s">
            <option value="{!s.Id}">{!s.Name}</option>
        </aura:iteration>
    </lightning:select>
    <ui:inputTextArea aura:id="inputCmp" label="Description"   rows="5" value="{!v.NewCase.Description}"/>        
    <h1 class="slds-m-top_large slds-text-heading_medium">Additional Information</h1>
    <lightning:input  aura:id="inputCmp" type="text" name="input1" label="Additional comments" value="{!v.NewCase.Comments}" />
    <lightning:input aura:id="inputCmp" type="text" name="input1" label="Email"  required="true" value="{!v.NewCase.email__c}" />
    <lightning:button variant="brand" label="Submit" title="Submit" onclick="{!c.createAccount}"  />
</lightning:card>

createAccount : function(component, event) 
{
    console.log("called");
var newcase = component.get("v.NewCase");
  console.log("new case",component.get("v.NewCase"));
var action = component.get("c.CreateCase");
action.setParams({
    "cas": newcase
});
action.setCallback(this, function(a) {
       var state = a.getState();
        if (state === "SUCCESS") {
            var name = a.getReturnValue();
            alert("submitted");
        }
    });

$A.enqueueAction(action);

},

updated code

<aura:component implements="forceCommunity:availableForAllPageTypes" access="global" controller="RE_Customcaseregistration">
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:attribute name="options" type="List"></aura:attribute>
<aura:attribute name="SelectedValue" type="String"></aura:attribute>
<aura:attribute name="NewCase" type="Case"
                default="{ 'sobjectType': 'Case',
                         'Subject': '',
                         'Description' : '',
                         'Comments':'',
                         'email__c' : ''}"/>
<lightning:card title="" class="supportblock">
    <h1 class="slds-m-top_large slds-text-heading_medium">Customer Support</h1>
    <lightning:input aura:id="inputCmp" type="text" name="input1" label="Subject" required="true" value="{!v.NewCase.Subject}" messageWhenValueMissing="Enter a value"/>
    <lightning:select class="select-auto-width" aura:id="SelectPropertyRcrd" name="select" label="Select a Property" required="true" value="{!v.SelectedValue}" onchange="{!c.UpdateSelectoption}"> 
        <option value="choose">Choose one...</option> 
        <aura:iteration items="{!v.options}" var="s">
            <option value="{!s.Id}">{!s.Name}</option>
        </aura:iteration>
    </lightning:select>
    <ui:inputTextArea aura:id="inputCmp" label="Description"   rows="5" value="{!v.NewCase.Description}"/>        
    <h1 class="slds-m-top_large slds-text-heading_medium">Additional Information</h1>
    <lightning:input  aura:id="inputCmp" type="text" name="input1" label="Additional comments" value="{!v.NewCase.Comments}" messageWhenValueMissing="Enter a value"/>
    <lightning:input aura:id="inputCmp" type="text" name="input1" label="Email"  required="true" value="{!v.NewCase.email__c}" messageWhenValueMissing="Enter value"/>
    <lightning:button variant="brand" label="Submit" title="Submit" onclick="{!c.createAccount}"  />
</lightning:card>

createAccount : function(component, event) 
{
    var allValid = component.find('inputCmp').reduce(function (validSoFar, inputCmp) {
            inputCmp.showHelpMessageIfInvalid();
            return validSoFar && !inputCmp.get('v.validity').valueMissing;
        }, true);
        if (allValid) {
            //call your server side action here
            console.log("called");
var newcase = component.get("v.NewCase");
  console.log("new case",component.get("v.NewCase"));
var action = component.get("c.CreateCase");
action.setParams({
    "cas": newcase
});
action.setCallback(this, function(a) {
       var state = a.getState();
        if (state === "SUCCESS") {
            var name = a.getReturnValue();
            alert("submitted");
        }
    });

$A.enqueueAction(action);
        } 

},

Answer 1

As You have marked field as required in your component markup, below piece of code should check the validity.

update:- please change the field id to anything other inputCmp. i have kept it inputCmpId. Make change in your component markup as well.

    ({
    createAccount : function(component, event, helper) {
        var allValid = component.find('inputCmpId').reduce(function (validSoFar, inputCmp) {
            // Displays error messages for invalid fields
            inputCmp.showHelpMessageIfInvalid();
            return validSoFar && inputCmp.get('v.validity').valid;
        }, true);
        // If we pass error checking, do some real work
        if(allValid){
            //call your server side action here
            console.log("called");
            var newcase = component.get("v.NewCase");
              console.log("new case",component.get("v.NewCase"));
            var action = component.get("c.CreateCase");
            action.setParams({
                "cas": newcase
            });
            action.setCallback(this, function(a) {
                   var state = a.getState();
                    if (state === "SUCCESS") {
                        var name = a.getReturnValue();
                        alert("submitted");
                    }
                });

            $A.enqueueAction(action);
        }
    }
})

Read more about it here:- Input form in lightning component