Using an input=“submit” field to submit instead of button=“” with parsley.js

Question

I currently have an ASP.net page which has one form tag around the entire page. Within that page, I have two forms that are validated with parsley.js when their respective submit button is clicked. At the moment, the trigger to validate these forms are buttons and I need for them to be input="submit". Does anyone have an idea on how to execute this?

Here's a JS fiddle example - http://jsfiddle.net/ukgvam9k/26/

<form method='post' id='form'>
<div class="first">
    <input type='text' id='firstname' name='firstname' data-parsley-group="first" required />
    <input type='text' id='lastname' name='lastname' data-parsley-group="first" required />
    <input type='text' id='phone' name='phone' data-parsley-group="first" required />
    <button type="button" id="submit-form">Submit</button>
</div>

<div class="secon">
    <input type='text' id='thisisrequired' name='thisisrequired' data-parsley-group="second" required />
    <button type="button" id="submit-form2">Submit 2</button>
</div>  

$("#submit-form").on('click', function () {
$('#form').parsley().validate("first");
if ($('#form').parsley().isValid("first")) {

    $('#form').parsley().destroy();
     console.log('valid');
     //$('#form').submit();
} else {
    console.log('not valid');
}});

$("#submit-form2").on('click', function () {
$('#form').parsley().validate("second");
if ($('#form').parsley().isValid("second")) {
    $('#form').parsley().destroy();
    console.log('valid');
} else {
    console.log('not valid');
}});

Answer 1

@Learner again came to the rescue! Here's his fiddle - js.fiddle

<div></div>