@extends('layouts/main-layout')
@section('custom-css')
<style>
    .error {
        color: red;
    }
</style>
@endsection
@section('content')


<div class='container' style="padding: 20px;">
    <h2> Campaign edit </h2>
    <form id='campaign' method='POST' action="{{route('campaign.update',$Campaignsstore->id)}}" enctype='multipart/form-data'>
     @csrf

        <div class='form-group'>
            <label for='campaign_id'>Campaign id<span class='error'>*</span></label><input type='text' class='form-control' id='campaign_id' name='campaign_id' value="{{!empty($Campaignsstore->campaign_id) ? $Campaignsstore->campaign_id : ''}}" placeholder='Please Enter Campaign_id'>
        </div>
        <div class='form-group'>
            <label for='campaign_name'>Campaign Name<span class='error'>*</span></label><input type='text' class='form-control' id='campaign_name' name='campaign_name' value="{{!empty($Campaignsstore->campaign_name) ? $Campaignsstore->campaign_name : ''}}" placeholder='Please Enter Campaign_name'>
        </div>
        <div class='form-group'>
            <label for='location'>Location<span class='error'>*</span></label><input type='text' class='form-control' id='location' name='location' value="{{!empty($Campaignsstore->location) ? $Campaignsstore->location : ''}}" placeholder='Please Enter Location'>
        </div>
        <div class='form-group'>
            <label for='department'>Department<span class='error'>*</span></label><input type='text' class='form-control' id='department' name='department' value="{{!empty($Campaignsstore->department) ? $Campaignsstore->department : ''}}" placeholder='Please Enter Department'>
        </div>
        <button type='submit' class="form-control" class='btn btn-default'>Submit</button>
    </form>
</div>
@endsection
@section('custom-js')
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.min.js'></script>
<script>
    $(document).ready(function() {
        $('#campaign').validate({
            rules: {
                campaign_id: {
                    required: true
                },
                campaign_name: {
                    required: true
                },
                location: {
                    required: true
                },
                department: {
                    required: true
                },
            },
            messages: {
                campaign_id: {
                    required: 'Campaign_id is required.'
                },
                campaign_name: {
                    required: 'Campaign_name is required.'
                },
                location: {
                    required: 'Location is required.'
                },
                department: {
                    required: 'Department is required.'
                },
            },
            submitHandler: function(form) {
                form.submit();
            }
        });

        // Set up dynamic validation rules and messages for form fields

    });
</script>
@endsection