Skip to content

Instantly share code, notes, and snippets.

View toofaniCoder's full-sized avatar
🎯
Focusing

Subroto Biswas toofaniCoder

🎯
Focusing
226 followers · 1 following
View GitHub Profile
@toofaniCoder
toofaniCoder / CUSTOM_VALIDATION_[10].md
Last active June 23, 2023 15:20

App.jsx Form Component with ZOD Validation

import {
  TextField,
  Select,
  Checkbox,
  Radio,
  Slider,
  Button,
  FormControl,
@toofaniCoder
toofaniCoder / 3_Ways_to_display_errors.md
Created June 23, 2023 10:26 
import { TextField, Button, Container, Paper, Stack } from '@mui/material';
import { Form, Field } from 'houseform';
import { z } from 'zod';
function App() {
  return (
    <>
      <Container maxWidth="xl" sx={{ py: 5 }}>
        <Paper sx={{ p: 4 }}>
          <Form onSubmit={(values) => console.log('Values: ', values)}>
@toofaniCoder
toofaniCoder / MUI_SERVER_SIDE_VALIDATION.md
Created June 23, 2023 07:01 
import { TextField, Button, Container, Paper, Stack } from '@mui/material';
import { Form, Field } from 'houseform';

function App() {
  return (
    <>
      <Container maxWidth="xl" sx={{ py: 5 }}>
        <Paper sx={{ p: 4 }}>
          <Form onSubmit={(values) => console.log('Form Values: ', values)}>
@toofaniCoder
toofaniCoder / MUI_Validation_[7].md
Last active June 13, 2023 05:51 
import {
  TextField,
  Select,
  Checkbox,
  Radio,
  Slider,
  Button,
  FormControl,
  FormControlLabel,
@toofaniCoder
toofaniCoder / Bootstrap_5_Validation_[6].md
Last active June 23, 2023 20:28 
import { Form, Field } from 'houseform';

function App() {
  return (
    <div className="container">
      <Form onSubmit={(values) => console.log('Form Values: ', values)}>
        {({ submit }) => (
          <form
            className="p-4 card shadow"
@toofaniCoder
toofaniCoder / Nested_Fields_[4].md
Created June 11, 2023 07:11 
import { TextField, Button, Container, Paper, Stack } from '@mui/material';
import { Form, Field } from 'houseform';

function App() {
  return (
    <>
      <Container maxWidth="xl" sx={{ py: 5 }}>
        <Paper sx={{ p: 4 }}>
          <Form onSubmit={(values) => console.log('Form Values: ', values)}>
@toofaniCoder
toofaniCoder / MUI_Library_[3].md
Created June 10, 2023 14:05 
import {
  TextField,
  Select,
  Checkbox,
  Radio,
  Slider,
  Button,
  FormControl,
  FormControlLabel,
@toofaniCoder
toofaniCoder / non_text_input_[2].md
Created June 10, 2023 13:07 
  <form
              onSubmit={(e) => {
                e.preventDefault();
                submit();
              }}
              className="card shadow p-4"
              action="#"
              method="post"
            >
@toofaniCoder
toofaniCoder / complex_form_[1].md
Created June 10, 2023 13:05 
 <div className="container py-3">
        <form className="card shadow p-4" action="#" method="post">
          <fieldset>
            <legend>Personal Information</legend>
            <div className="mb-3">
              <label htmlFor="name" className="form-label">
                Name:
              </label>
              <input
@toofaniCoder
toofaniCoder / teacher-crud.md
Created February 19, 2023 10:40

Home Page

import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
// import classroom from '../assets/classroom.svg';
import { Link } from 'react-router-dom';

const Index = () => {
  return (