imageState not working

[codebeginer]

I have tried this option in the demo example of the file but still this does't work. `

<style>
  .cropit-preview {
    background-color: #f8f8f8;
    background-size: cover;
    border: 1px solid #ccc;
    border-radius: 3px;
    margin-top: 7px;
    width: 800px;
    height: 450px;
  }

  .cropit-preview-image-container {
    cursor: move;
  }

  .image-size-label {
    margin-top: 10px;
  }

  input {
    display: block;
  }

  button[type="submit"] {
    margin-top: 10px;
  }

  #result {
    margin-top: 10px;
    width: 900px;
  }

  #result-data {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    word-wrap: break-word;
  }
</style>

Resize image

Submit

<div id="result">
  <code>$form.serialize() =</code>
  <code id="result-data"></code>
</div>

<script>
  $(function() {
    $('.image-editor').cropit();
    $('.image-editor').cropit({
		'imageState':'k.jpg',
	});

    $('form').submit(function() {
      // Move cropped image data to hidden input
      var imageData = $('.image-editor').cropit('export');
      $('.hidden-image-data').val(imageData);

      // Print HTTP request params
      var formValue = $(this).serialize();
      $('#result-data').text(formValue);

      // Prevent the form from actually submitting
      return false;
    });
  });
</script>

`

[FelixLeChat]

Try : $('.image-editor').cropit('imageSrc', 'k.jpg'); instead of $('.image-editor').cropit({'imageState':'k.jpg'});

[sircEUNHO]

I also have this problem I tried

$('.image-editor').cropit({
    exportZoom: 1.25,
    imageBackground: true,
    imageBackgroundBorderWidth: 20,
    width: 400,
    height: 400,
    allowDragNDrop: false,
    imageState: {
        src: 'http://localhost:3000/magisgit/printright/public/storage/projects/240/AoohK1CbmMLuKYaP8lfSsOPBBdRhbvOJB0bQfHY1.jpeg',
    },
    onZoomChange: (() => {
        alert('test');
    }),
    onOffsetChange: (() => {
        alert('two');
    }),
});

but it doesnt work, so i tried:

$('.image-editor').cropit('imageSrc', 'http://localhost:3000/magisgit/printright/public/storage/projects/240/AoohK1CbmMLuKYaP8lfSsOPBBdRhbvOJB0bQfHY1.jpeg');

my html mark up is this:

<div class="image-editor">
    <div class="cropit-preview"></div>
    <br>
    <br>
    <center>
        <span class="fa fa-search-minus zoom-ft"></span>
        <input type="range" class="cropit-image-zoom-input">
        <span class="fa fa-search-plus zoom-ft"></span>
    </center>
    <br>
    <div class="text-center">
        <button class="btn register">
            <span v-text="isCropping">Crop Photo</span>
        </button>
    </div>
</div>

but this still didn't work? what is the problem of my code?

[webfarmer]

anyone found a solution yet. I'm getting the same problem.