How I update data in push_array data in livewire or laravel

To update the input_Data value of an array element with a specific id in Livewire or Laravel, you can use the following steps:

Pass the array from the component to the view.
In the view, add a form with an input field for the updated value and a hidden field for the array index.
When the form is submitted, emit an event to the Livewire component with the updated value and array index.
In the Livewire component, update the value of the specified array element with the new value.
Here’s an example implementation:

In the component:

class MyComponent extends Component
{
    public $data = [
        ['id' => 0, 'input_Data' => 'Up to 15 Groups / Month'],
        ['id' => 1, 'input_Data' => 'Up to 60 CSV File Importing / Month'],
        ['id' => 2, 'input_Data' => 'Up to 15 SMTP Config'],
        ['id' => 3, 'input_Data' => 'Up to 20 Email Template Can Make'],
        ['id' => 4, 'input_Data' => 'Up to 150 Ai Writer Call / Month'],
        ['id' => 5, 'input_Data' => 'Markitach SMTP Limit 1000 Emails'],
    ];

    protected $listeners = ['updateInputData'];

    public function updateInputData($index, $value)
    {
        $this->data[$index]['input_Data'] = $value;
    }

    public function render()
    {
        return view('livewire.my-component', ['data' => $this->data]);
    }
}

In the view:

@foreach($data as $index => $item)
    <div>
        <span>{{ $item['input_Data'] }}</span>
        <button wire:click="$emit('editInputData', {{ $index }})">Edit</button>
    </div>
@endforeach

<livewire:my-edit-form />

In the edit form component:

class MyEditForm extends Component
{
    public $index;
    public $value;

    protected $listeners = ['editInputData'];

    public function editInputData($index)
    {
        $this->index = $index;
        $this->value = $this->getData()[$index]['input_Data'];
        $this->dispatchBrowserEvent('showEditModal');
    }

    public function updateData()
    {
        $this->validate(['value' => 'required']);

        $this->emitUp('updateInputData', $this->index, $this->value);

        $this->dispatchBrowserEvent('hideEditModal');
    }

    public function render()
    {
        return view('livewire.my-edit-form');
    }
}

In the edit form view:

<div id="edit-modal" style="display:none;">
    <form wire:submit.prevent="updateData">
        <input type="hidden" wire:model="index">
        <label for="value">Input Data:</label>
        <input type="text" wire:model.defer="value" id="value">
        @error('value')<span>{{ $message }}</span>@enderror
        <button type="submit">Save</button>
    </form>
</div>

<script>
    document.addEventListener('DOMContentLoaded', function () {
        Livewire.on('showEditModal', () => {
            document.getElementById('edit-modal').style.display = 'block';
        });

        Livewire.on('hideEditModal', () => {
            document.getElementById('edit-modal').style.display = 'none';
        });
    });
</script>

I hope this code is the answer you were looking for