duplicate page not working

jesschow

Payload Team

9 months ago

56

• 

  Shubham27

  8 months ago

  yes @jesschow

  
  

  
  

  https://docs.google.com/document/d/1JYuIX7RXVhUslCm5oRXJKj7FY2ds7r-1VIAhkn28CCM/edit
  

  
  

  @jesschow here is the problem description that i am getting. hope it helps you understand issue that i am facing.

• 

  Jarrod

  8 months ago

  @Shubham27 The payload config is meant to be static. I think what you should instead do is create a custom field, possibly using the new

  json

  field type. You would render a custom select component that would fetch data from your endpoint and when the user submits, you add the data to the json field.

• 

  bhavikak

  8 months ago

  @Jarrod can you share me small example of custom select field with dynamic options or any other reference that related to it.

• 

  remy

  7 months ago

  Does this mean I can't reference data from one source (i.e. text input) and present it in a dropdown? More info on my scenario:

  https://discord.com/channels/967097582721572934/1072241616917643454/1072241616917643454
• 

  bhavikak

  7 months ago

  Hiii @remy i'm want to render data in a select menu using custom select field

  
  

  
  

  i tried from this

  https://payloadcms.com/docs/admin/components#fields:~:text=%7D%3B-,Field%20Component,-When%20writing%20your

  but it doesn't store selected value in api

• 

  remy

  7 months ago

  I managed to store the selected value with useFormFields -

  https://payloadcms.com/docs/admin/hooks#useformfields

  . Hope that helps

• 

  bhavikak

  7 months ago

  thanks @remy i'll try it.

  
  

  
  

  hello @remy i tried but didn't work

  
  

  
  

  this is the my code can you help me

  

  
• 

  remy

  7 months ago

  useFormFields

  , not

  useField
  

  
  

  const { fields, dispatch } = useFormFields(([fields, dispatch]) => ({ fields, dispatch }))
  console.log('fields', JSON.stringify(fields))

• 

  bhavikak

  7 months ago

  hii @remy still not working it's not storing selected value even it's not create a field

  
  

  
  

  
  

  
  

  

  CustomSelectMenu.tsx
• 

  remy

  7 months ago

  Well the rest is just react:

  
  

    const handleChange = (e: ChangeEvent<HTMLSelectElement>, path: string) => {
      setSelectedOption(e.target.value) // React.useState
    };

  
  
  

  <select value={selectedOption} onChange={(e) => handleChange(e, path)}>
    <option>...</option>
  </select>

  
  

  
  

  Obviously I can't see what's happening in your reducer but using React.useState will suffice for setting the selected value in the example I've provided. I'm assuming data.fields contains the values you're expecting?

• 

  bhavikak

  7 months ago

  data.fields give me the all fields data.

  
  

  
  

  it store only in a state right?

  
  

  
  

  is it store into the api?

• 

  Jarrod

  7 months ago

  Hey @bhavikak! You should change your field type from

  ui

  to

  text

  🙂

  
  
  

  As you have noticed, ui fields

  do not

  store their data in the DB. So you will want to use a field type that does, i.e. text. You can leave the rest of your config as is, using the custom component that you created!

• 

  bhavikak

  7 months ago

  okay @Jarrod i'll try

  
  

  
  

  so i need to change only type?

• 

  Jarrod

  7 months ago

  Yeah, and personally I think you could get away with using

  useField

  hook, and passing the path from props to that hook and using the

  setValue

  function to set the value of the field instead of the useFormFields

• 

  bhavikak

  7 months ago

  wohooo it's working with useFormField as well so i need to changed with usefield

  
  

  
  

  thanks a lot @Jarrod @remy 🙌

• 

  Jarrod

  7 months ago

  Absolutely, maybe I'll make a vid on custom components like the one you made 🤔

• 

  bhavikak

  7 months ago

  yes, you can🤘

  
  

  
  

  hii @Jarrod when i select the item it's not enable publish button

  
  

  
  

  
• 

  Jarrod

  7 months ago

  Can you log Form state for me? Using useFormFields?

• 

  bhavikak

  7 months ago

  yaa

  
  

  
  

  
• 

  remy

  7 months ago

  This is also the case for me. It persists in draft saves but doesn't trigger a change

• 

  Jarrod

  7 months ago

  And just to clarify, you are both using

  useField

  ?

• 

  remy

  7 months ago

  I haven't updated mine from

  useFormField

  but i'm happy to follow along for @bhavikak 's issue.

• 

  bhavikak

  7 months ago

  yes @Jarrod i'm use useFormField

  
  

  
  

  nope

• 

  Jarrod

  7 months ago

  @bhavikak can you use useField instead?

  
  
  

  Otherwise

  useForm

  exposes a

  setModified

  function that you can use to set the form as modified

• 

  bhavikak

  7 months ago

  i tried with usefield as well but it's not save my selected option

  
  

  
  

  this is the my code

  
  

  
  

  hello @Jarrod

  
  

  
  

  i'm waiting for your respone.

• 

  remy

  7 months ago

  I think Jarrod wants you to convert to

  useField

  first

  
  

  
  

  When I get to reimplementing this, I'll create a new thread, as we're quite far from the original issue.

• 

  bhavikak

  7 months ago

  hii @remy i tried it but it's not store value into the colliction api

  
  

  
  

  hello @remy my functionality is still pending can you suggest how i complete it using useField